2012-02-28 3 views
0

저는 wordpress template 페이지에 포함시키고 자하는 JavaScript에 문제가 있습니다.wordpress에 자바 스크립트가 포함되어 있습니다.

내가 뭘 하려는지 : 이 페이지에서 - 페이드 인/아웃 6 이미지 (당신은 헤더의 오른쪽 상단에있는 첫 번째 이미지를 볼 수 있습니다) 자바 스크립트를 호출하고 싶습니다. .

<?php 
function load_scripts() { 
    wp_enqueue_script('jquery'); 
    wp_enqueue_script('innerfade', '/wp-content/themes/visualtime/js/innerfade.js', array('jquery')); 
}  
add_action('init', 'load_scripts'); 
?> 

그리고이 :

<?php wp_enqueue_script('innerfade', '/vworker/wp-content/themes/visualtime/js/innerfade.js', array('jquery'));?> 
<?php wp_head();?> 
<script type="text/javascript"> 
$(document).ready(
function(){ 
$('ul#screenshots').innerfade({ 
speed: 1000, 
timeout: 4000, 
type: 'random', 
containerheight: '259px' 
}); 
}); 
</script> 

이 내가 functions.php에있는 것입니다 : 이것은 header.php에있는 것입니다 http://www.pcworld.ro/vworker/wp-content/themes/visualtime/js/innerfade.js

:

는 스크립트입니다 homepage.php에서 자바 스크립트를 담당해야하는 코드입니다 (워드 프레스 템플릿 페이지에서 자바 스크립트가 작동해야합니다) :

<div id="screenshot" style="overflow:hidden;"> 
      <ul class="innerfade" id="screenshots" style="list-style: none outside none; margin: 0pt; padding: 0pt; cursor: pointer; position: relative; height: 259px;" onclick="location.href='#'"> 
       <li style="z-index: 6; position: absolute; display: none;"> 
        <img src="/vworker/wp-content/themes/visualtime/images/productscreenshot1.jpg" alt="Room Booking System"> 
       </li> 
       <li style="z-index: 5; position: absolute; display: none;"> 
        <img src="/vworker/wp-content/themes/visualtime/images/productscreenshot2.jpg" alt="Complete Administration Panel"> 
       </li> 
       <li style="z-index: 4; position: absolute; display: none;"> 
        <img src="/vworker/wp-content/themes/visualtime/images/productscreenshot3.jpg" alt="Meeting Room Bookings"> 
       </li> 
       <li style="z-index: 3; position: absolute; display: none;"> 
        <img src="/vworker/wp-content/themes/visualtime/images/productscreenshot4.jpg" alt="View Statistics of All Room Bookings"> 
       </li> 
       <li style="z-index: 2; position: absolute; display: none;"> 
        <img src="/vworker/wp-content/themes/visualtime/images/productscreenshot5.jpg" alt="Including a Helpdesk System"> 
       </li> 
       <li style="z-index: 1; position: absolute; display: list-item;"> 
        <img src="/vworker/wp-content/themes/visualtime/images/productscreenshot6.jpg" alt="Intelligent Recurring Bookings"> 
       </li> 
      </ul> 
</div> 

나는 자바 스크립트가 관련되어있을 때 wordpress와 절대 noob에 관해서 초보자입니다. 내가 잘못하고있는 것을 설명해 주시겠습니까?

답변

2

이것은 워드 프레스 테마 개발자들 사이에서 일반적이며 다른 라이브러리와의 충돌을 피하기 위해 자동으로 jQuery.noConflict()을 jquery 파일에 포함합니다.
http://docs.jquery.com/Using_jQuery_with_Other_Libraries

여러 선택 :

이 - 또는 텍스트 jQuery 모든 코드에 $를 교체 JQuery와 파일의 바닥에서 jQuery.noConflict();를 제거합니다. 당신이 사용하는 플러그인 파일을 절연하고 그 안에 $를 사용할 수있는 준비의 인수로 $

- 또는

변경

$(document).ready(
function(){ 
    //......... 
} 

jQuery(document).ready(
function($){ 
    //......... 
} 

OK입니다해야

관련 문제