2009-07-23 1 views
0

을 설정jCarousel 문제 - 이미지의 불투명도를 가져 가면 지금까지 내가 표시 및 txt 파일을 통해 이미지를로드 jCarousel 가지고

내가 다음 번에 때 사용자의 풋 4 개 이미지를 표시되고 싶지 1 개의 이미지 위에 마우스를 놓고 나머지 3 개의 이미지는 불투명도를 약화시켜 30 %로 만듭니다. 그들이 옆에 이미지에 마우스를 이동하면 그 때 나는 그 이미지가 100 % 불투명도 및 다른 3 개 이미지 30 % 불투명도가되고 싶어요.

그래서 위에 마우스로 이미지는 항상 100 % 불투명도, 나머지 30 %가 될 것이다, 그래서 눈에 띄는. 사용자가 마우스를 jCarousel 상자 밖으로 이동하면 모든 이미지에 100 % 불투명도가 표시됩니다. 나는이

감사 유사한 코드를 사용하고

.

편집

내가 여기있다, 이전에 코드를 추가해야 죄송합니다 : http://pastebin.com/m54cd73d8 이 내가 그것은 종류의 작동 지금까지 nickrance.co.uk/jcarousel/dynamic_ajax.html있을 것입니다, 이 비활성 이미지를 페이드,하지만 난 마우스가 jCarousel의 사업부에서 이동 때 모든 이미지의 불투명도를 복원 할 mouseOut 이벤트를 필요로 생각합니다. 또한 , 그것은 첫 번째 4 개 이미지를 작동하는 것, 그리고 내가 회전 목마에 10 개 개의 이미지를 가지고, 나머지는 아무것도하지 않는 것 :이야

새로운 현재 코드 : 지금까지



    
$(window).bind("load", function() { 
    var activeOpacity = 1.0, 
     inactiveOpacity = 0.3, 
     testOpacity = 0.3, 
     fadeTime = 50, 
     clickedClass = "selected", 
     thumbs = "#mycarousel li"; 

    $(thumbs).fadeTo(1.0, activeOpacity); 

    $(thumbs).hover(
     function(){ 

      $(thumbs).fadeTo(fadeTime, inactiveOpacity); 

      $(this).fadeTo(fadeTime, activeOpacity); 
     }, 
     function(){ 
      // Only fade out if the user hasn't clicked the thumb 
      if(!$(this).hasClass(clickedClass)) { 
       $(this).fadeTo(fadeTime, activeOpacity); 
      } 
     }); 
    $(thumbs).click(function() { 
     // Remove selected class from any elements other than this 
     var previous = $(thumbs + '.' + clickedClass).eq(); 
     var clicked = $(this); 
     if(clicked !== previous) { 
      previous.removeClass(clickedClass); 
     } 
     clicked.addClass(clickedClass).fadeTo(fadeTime, activeOpacity); 
    }); 
}); 
    
+0

을 불투명도를 사라질 것이다. 게시하거나 문제를 해결할 답변을 기다리지 마십시오. – Sneakyness

+0

코드 추가 - 죄송이 전에 그것을 추가해야 http://pastebin.com/m54cd73d8! 감사합니다. –

답변

0

당신은 당신이 코드를 추가 할 수 있으며 잘 될 것입니다 :

$(".jcarousel-wrapper").on('mouseleave', function(){ 
    $(thumbs).fadeTo(fadeTime, 1.0); 
}); 

그리고 당신의 HTML은 다음과 같이해야합니다 :

마우스가 회전 목마를 떠날 때
<div class="jcarousel-wrapper"> 
    <div class="jcarousel"> 
     <ul id="mycarousel"> 
      <li>... 

모든 이미지는 ... 1 우리는 당신의 정확한 코드를 볼 필요가