호버 스의 flexslider 컨트롤 표시/숨기기?

전/다음 화살표가있는 flex slider입니다. 예쁜 표준입니다. 페이지로드시 화살표를 숨기고 사용자가 캐 러셀 정보 위에 마우스를 올려 놓았을 때만 표시되도록합니다.호버 스의 flexslider 컨트롤 표시/숨기기?

이

$(".flex-container.home ul.flex-direction-nav").hide(); 
$(".flex-container.home .flexslider").hover(
    function(){ 
     $(".flex-container.home ul.flex-direction-nav").fadeIn(); 
    }, 
    function(){ 
     $(".flex-container.home ul.flex-direction-nav").fadeOut(); 
    } 
)

문제는 이제 사용자가 실제로 화살표 자체를 가리킬 때 기술적으로 내가 그렇게하도록 부탁 해요 때문에, 그것은, 페이드 아웃 것입니다 :

여기 내 코드입니다. 나는 몇 가지 중요한 CSS를 ul.flex-direction-nav CSS 스타일에 추가하려고 시도했지만 fade out이 발생하는 것을 막지는 못한다.

출처

2013-04-01 panzhuli

의 문제를 해결? – lifetimes

내가가는 것에 대해 알게 해주세요 – panzhuli

ok - first jsFiddle :) http://jsfiddle.net/h4krS/1/ – panzhuli

코드를 다음과 같이 변경하십시오. 선택기를 수정하고 여분의 코드 작성을 줄이기 위해 fadeToggle()을 사용했습니다.

$(document).ready(function() { 
    $(".flex-container.home ul.flex-direction-nav").hide(); 
    $(".flex-container.home").hover(function() { 
     $(" ul.flex-direction-nav").fadeToggle(); 
    });  
});

Here is a working jsFiddle :

다음은 당신이 원하는 지정하는 방법을 작동하는 새로운 버전이다. CSS 아래

출처

2013-04-01 21:50:55 lifetimes

또한 jquery 1.9.x로 업데이트해야합니다. 내 고향 1.4.x를 사용하고 있었는데 ... – panzhuli

-1

pauseOnHover:true, //this option working good

출처

2014-07-25 13:47:28 vijay

당신이하는 일에 대한 설명과 문제 해결 방법을 포함하면 대답이 더 유용 할 것입니다. 더 많은 upvotes도 얻을 수 있습니다. :) –

당신이 어떤 기회에 의해 jsFiddle있으세요 ME-

.big-slider .flex-direction-nav {opacity: 0 !important;} 
.big-slider .flex-direction-nav:hover {opacity: 1 !important;}

출처

2014-08-25 06:23:48

호버 스의 flexslider 컨트롤 표시/숨기기?

답변

관련 문제