2010-03-10 8 views
0

누구든지 내 코드에 문제가 없는지 확인하십시오. 나는 단지 그것을 이해할 수 없다!jQuery 애니메이션 배경색 - 작동하지 않음

파일 경로가 정확합니다. 콘솔에서 h3 요소를 가져 왔을 때 "hover"에 텍스트를 출력해야합니다.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
     "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
    <title>CSS box</title> 
    <link href="style.css" rel="stylesheet" media="screen" /> 
    <script type="text/javascript" src="jquery-1.4.2.min.js"></script> 
    <script type="text/" src="jquery.color.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $('#box h3').mouseover(function() { 
       console.log('hover'); 
       $('#box h3').stop(true, true).animate({ 
        backgroundColor: '#E4A333' 
       }, 200); 
      }); 
     }); 
    </script> 
</head> 
<body> 

<div id="box"> 
    <h3><a href="#">Lorem ipsum dolor sit amet.</a></h3> 
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer adipiscing consectetur lectus, sed mollis ante dictum id. Nunc magna neque, ornare ac interdum at, pharetra vel leo. Morbi placerat, orci ut sollicitudin dictum, nisi eros feugiat tortor, ac ultricies est leo ac est. Suspendisse justo urna, porttitor eget adipiscing dictum, malesuada nec diam.</p> 
</div> 

</body> 
</html> 

은 배경색을 변경하는 가정입니다. (제거) 이 (대부분 몇 시간에 제거됩니다)

답변

1

컬러 플러그인에 대한 귀하의 스크립트 태그가 기형입니다 :

<script type="text/" src="jquery.color.js"></script> 

불행히도,

여기

라이브 링크 :(작동하지 않습니다 해야합니다.

<script type="text/javascript" src="jquery.color.js"></script> 

현재는이 페이지에 포함되지 않는 것 때문에 jQuery.color 플러그인이 존재하지 않는 것처럼입니다

+0

감사합니다. Nick! 나는 그것을 고쳤다. 그러나 그것은 아직도 나를 위해 일하는 것처럼 보이지 않는다. : (원하는 경우 여기에서 자세히 살펴보십시오. http://nike1.se/box/ – qwerty

+0

Firefox에서 firebug + firebug에서 링크를 시도했는데, 다음과 같은 메시지가 표시됩니다. (프랑스어 메시지는 다운로드에 실패했음을 의미합니다. 그 파일) 다음 소스 코드를 http://china1.se/box/jquery-1.4.2.min.js –

+0

아마 (jquery와 동일) –

0

당신에게 싫어하지만, 정확한 소스 코드를 복사하고 스크립트 링크를 자바 스크립트에 직접 연결하도록 변경했습니다 (예 : <script type="text/javascript" src="http://nike1.se/box/jquery-1.4.2.min.js"></script>), 내 컴퓨터에서 예상대로 작동합니다.

나는 문제가 테스트 페이지의 문에 경로를 의심 :

<script type="text/javascript" src="/jquery-1.4.2.min.js"></script> 
<script type="text/javascript" src="/jquery.color.js"></script> 

스크립트는 /box 하위 디렉토리에 실제로있다. 아마도 소스 링크는 src="query-1.4.2.min.js" 또는 src="/box/jquery-1.4.2.min.js"이어야합니다. 또는 웹 서버 구성에 따라 전체 경로를 포함 시키거나 BASE element을 사용하여 문서의 기본 디렉토리를 올바르게 설정해야 할 수도 있습니다.

+0

정확히 내가 위의 의견에서 말한 것. –

+0

죄송합니다, 데이빗, 당신 말이 맞았습니다.하지만 어떻게 가능합니까? 동일한 디렉토리에 jquery 파일이 있습니까? 아래에 게시 된 예제와 마찬가지로? 그리고 Nick에게 감사드립니다. 해당 버전이 훨씬 더 효과적입니다. :) – qwerty

+0

경로를 시작한 이후로 동일한 디렉토리에서 jquery 파일을 찾지 않습니다. '/'기호 루트 디렉토리를 찾습니다. – ghoppe

0

애니메이션을 적용하기 전에 요소에 배경색이 이미 적용되어 있어야합니다. 함수 호출 바로 전에 CSS 또는 CSS를 통해 요소에 배경색을 적용 해보십시오.

관련 문제