Изображение исчезает быстро, а не fadeOut

эй, ребята, я пытаюсь работать с полноэкранным слайдером css3. Теперь проблема в том, когда я сделать изображение FADEOUT вдруг скрывает, как если бы я закодирован метод скрыть() .. вот код, CSS-Изображение исчезает быстро, а не fadeOut

body { 
     margin: 0px; 
    } 

    #backgroundImageContainer { 
     height: 100%; 
     width: 100%; 
     position: fixed; 
    } 
    .backgroundImages { 
     width: 100%; 
     height: 100%; 
     position: absolute; 
     z-index: 1; 
    } 
    .animationZoomIN { 

     -webkit-transition: all 5.3s ease-out; 
     -moz-transition: all 5.3s ease-out; 
     -o-transition: all 5.3s ease-out; 
     transition: all 5.3s ease-out; 
     -moz-transform: scale(1.17); 
     -webkit-transform: scale(1.17); 
     -o-transform: scale(1.17); 
     transform: scale(1.17); 
     -ms-transform: scale(1.17); 
    } 
    #thumbsList { 
     position: absolute; 
     z-index: 2; 
     margin-top: 11px; 
     margin-right: 11px; 
     color: white; 
     font-family: verdana; 
     font-size: 13px; 
     list-style-type: none; 
    } 
    #thumbsList li { 
     float: left; 
    }

Javascript

$(document).ready(function() { 

     $('.backgroundImages').addClass('animationZoomIN'); 
     $('.backgroundImages').bind("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function() { 


      $('.backgroundImages').fadeOut(1000);}); 
    });

И HTML

<div id="backgroundImageContainer"> 
    <img class="backgroundImages" src="wallpaper-452100.png" /> 

</div> 
<ul id="thumbsList"> 
    <li>Steam Punk</li> 
    <li>Car</li> 

</ul>

Обратите внимание на метод .backgroundImages FADEOUT не работает, он suddently делает изображение исчезает. Можете ли вы, ребята, сказать мне, где я ошибаюсь? Спасибо.

Ok вот Скрипки, http://jsfiddle.net/4xymL/

я не знаю, изображение как-то не diplaying, попробуйте использовать некоторые образцы изображения, пожалуйста, спасибо. soo много.

источник

2013-09-01 designerNProgrammer

http://www.jsfiddle.net поможет вам получить ответы. – Itay

Извините, я не понимал. :( – designerNProgrammer

как можно это сделать, не удалять изображение, оно все равно будет присутствовать и может быть подтверждено щелчком правой кнопки мыши. i затем исчезает изображение после анимации? – designerNProgrammer

Изменение непрозрачности, как показано в этом demo, а затем исчезать после задержки 5 секунд (это зависит от того, что вы упомянули в увеличении в CSS.

$(document).ready(function() { 

    $('.backgroundImages').addClass('animationZoomIN'); 
    $('.backgroundImages').bind("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function() { 


     $('.backgroundImages').css("opacity", 0).delay(5000).fadeOut(); 
    }); 
});

Обновлено исчезать, так как изменение непрозрачности только будет

источник

2013-09-01 17:27:43 Lobo

Изображение исчезает быстро, а не fadeOut

ответ

Смежные вопросы