간단한 자바 스크립트 페이딩 효과 IE7/8에서 작동하지 않음, 다른 브라우저에서는 괜찮습니다.

StackOverflow https://stackoverflow.com/questions/1904826

  •  19-09-2019
  •  | 
  •  

문제

보다 http://jonesonter.notomato.com.au/.

나는 당신이 서로 위에있는 이미지 스택 위에 배치 된 일부 목록 요소를 호버 할 때 간단한 페이딩 효과가 있습니다.

$("#homeNav li").hover(function(){
    //make a variable and assign the hovered id to it
    var elid = $(this).attr('id');
    //hide the image currently there
    $("div#homeImages div").hide();
    //fade in the image with the same id as the selected buttom
    $("div#homeImages div#" + elid + "").fadeIn("slow");

    });

그러나 인터넷 익스플로러에서는 작동하지 않습니다.

나는 검색을 시도했지만 나를 허용 할 간단한 페이딩 기술을 찾을 수는 없습니다. 이미지 스택 스택은 일련의 컨트롤 세트 (이 경우 <li> 요소) 이미지 중 하나가 희미 해지는 특정 컨트롤 위에 마우스를 가져갈 때, 다른 이미지는 모두 숨겨져 있어야하며 현재는 사라져야합니다.

즉, 항상 오류가있는 것 같습니다. 내가 어디로 가고 있는지 아는 사람이 있습니까?

도움이 되었습니까?

해결책

다음은 저를 위해 작동합니다 (HTML 변경) :

<div id="homeImages">
    <div style="display: none; width:950px; height:500px; background:url('http://jonesonter.notomato.com.au/wp-content/themes/jonesonter/img/home-page/conditioned.jpg');" id="homeConditioned"></div>
    <div style="display: none; width:950px; height:500px; background:url('http://jonesonter.notomato.com.au/wp-content/themes/jonesonter/img/home-page/guided.jpg');" id="homeGuided"></div>
    <div style="display: block; width:950px; height:500px; background:url('http://jonesonter.notomato.com.au/wp-content/themes/jonesonter/img/home-page/informed.jpg');" id="homeInformed"></div>
    <div style="display: none; width:950px; height:500px; background:url('http://jonesonter.notomato.com.au/wp-content/themes/jonesonter/img/home-page/shaped.jpg');" id="homeShaped"></div>
    <div style="display: none; width:950px; height:500px; background:url('http://jonesonter.notomato.com.au/wp-content/themes/jonesonter/img/home-page/sustained.jpg');" id="homeSustained"></div>
</div>

다른 팁

어둠 속에서 몇 장의 사진, 나는 지금 집에 잠자리에 들고있다 :)

  • 프로토 타입에서 페이드 효과가 클래스가없고 단순한 것을 선호한다는 것을 알고 있습니다. <div> 희미해질 요소 내부의 디렉트리. 각 이미지에 이것을 추가 해보겠습니까?
  • 이미지 레이아웃을 제공하면 어떻게됩니까 (예 : zoom: 1 CSS 속성)
  • 이미지에 배경색을 주면 어떻게됩니까?
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top