Блог

У меня есть этот запрос при загрузке документа:

    jQuery( window ).load(
        function(){

        $('#container img').animate({"opacity": 1});

        $('#container img').hover(function() {
            $(this).stop().animate({ "opacity": .5 });
        }, function() {
            $(this).stop().animate({ "opacity": 1 });
        });

            setTimeout(
                function(){
                    window.scrollTo( 0, 0 );
                },
                50
            );

        }
    );
  

Это оператор if, к которому я добавлю, когда у меня что-то будет работать правильно:

 function touchMove(event) {
event.preventDefault();
if ((event.touches.length === 1) amp;amp; (swipeDirection === 'down') amp;amp; (swipeLength >= 90) amp;amp; (swipeLength <= 120)) {
    curX = event.touches[0].pageX;
    curY = event.touches[0].pageY;
    ('1.png').hover(function() {
        $(this).stop().animate({
            "opacity": '1'

        });
  

И этот CSS:

 <style>
        #container {
            background: transparent;
            left: 5px;
            top: 20px;
            position: relative;
            border: 1px dotted #ddd;

        }
 </style>
  

И затем это в теле:

 <div id="swipe-frame" class="swipe-element" ontouchstart="touchStart(event,'swipe-frame');" ontouchend="touchEnd(event);" ontouchmove="touchMove(event);" ontouchcancel="touchCancel(event);" style="width:100%; height:100%; background: transparent; -webkit-user-select: none;padding-top:128px;">
</div>

    <div id="container">
    <img src="1.png" alt="image" />
    <img src="2.png" alt="image" />
    <img src="3.png" alt="image" />
    <img src="4.png" alt="image" />
    <img src="5.png" alt="image" />
</div>
  

Потому что я пытаюсь загрузить 5 изображений друг на друга, чтобы все выглядело так, как будто это одно изображение. При загрузке документа они становятся серыми. Затем, когда пользователь проводит пальцем по изображению, изображения анимируются до их нормального состояния. Но ничего не появляется. Кто-нибудь знает почему? http://tinyurl.com/62hakh2 Спасибо, что посмотрели.

Попробуйте удалить их height:100% из #swipe-frame div, так как в этом случае div займет весь экран, а #container div будет сразу за ним.

Если вы пытаетесь загрузить изображения друг на друга, вам нужно применить к ним стиль, а не только к их контейнеру. Попробуйте:

  #container img {
    background: transparent;
    left: 5px;
    top: 20px;
    position: relative;
    border: 1px dotted #ddd;    
    }