jquery css div 图像不出现

标签 jquery html css jquery-animate

我有关于何时加载文档的请求:

   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) && (swipeDirection === 'down') && (swipeLength >= 90) && (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感谢您的关注。

最佳答案

尝试从 #swipe-frame div 中删除 height:100%,因为这会使 div 占据整个屏幕和 #container div 将紧随其后。

关于jquery css div 图像不出现,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5823696/

相关文章:

javascript - 如何减少Javascript中的时间计数器

JQuery 菜单无法正常工作

javascript - jQuery Ajax 发布到 php 不打印响应

javascript - Chrome 扩展程序/网络应用程序 session 控制

python - CSS 背景图片无法加载

css - 如何在滚动条上显示 "inspect element"?

jquery - Div 元素未展开以容纳 HTML 文本

html - 如何将 pandoc_options 作为 output_options 传递给 rmarkdown::render()

java - 如何使用 HTMLParser 获取标签之间的值

php - 如何使滚动条出现在div的边框内