jquery - 加载页面时将图像滑入页面

标签 jquery sliding

我试图在加载页面时将图像滑入页面,我的脚本工作正常,但是当图像尚未缓存时,它会先加载图像,然后执行脚本。我已尝试预加载图像,但仍然出现问题。

这是一个测试链接:http://luvly.co.nz/space/akatarawa-road.html

这是我一直在处理的脚本:

预加载

$.fn.preload = function() {
            this.each(function(){
                $('<img/>')[0].src = this;
            });
        }

        // Usage:

        $(['images/aka/aka1.2.jpg',
            'images/aka/aka2.jpg',
            'images/aka/aka3.jpg',
            'images/aka/aka4.jpg',
            'images/aka/aka5.jpg',
            'images/aka/aka6.jpg', 
            'images/aka/aka7.jpg', 
            'images/aka/aka8.jpg', 
            'images/aka/aka9.jpg', 
            'images/aka/aka10.jpg']).preload();

slider :

$(function() {
  $("#1-slide").one('load', function () {
    $(this).show("slide", { direction: "right" }, 1000);
  }).each(function() {
    if(this.complete) $(this).load();
  });
});

此外,我知道我不应该使用数字来启动 ID,但目前它仅用于测试目的。

最佳答案

您只需确保在运行脚本之前加载图像,因此请尝试如下操作:

<body>
<img src=image1.jpg" style="display:none" />
....
Your script calling

此解决方案取决于首先调用您希望在幻灯片中显示的图像,因此在运行脚本之前将其下载到缓存中。所以它会首先被缓存

关于jquery - 加载页面时将图像滑入页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15282965/

相关文章:

jquery,如何使用外部站点的源滚动 iFrame?

android - 移动 videoView...使用平移动画

悬停时 CSS 滑动下划线 - 颜色过渡不适用于已访问的链接

iphone - 无需松开手指即可从一个按钮滑动到另一个按钮

javascript - jQuery tablesorter 使用分页和 sortForce

javascript - 如何在文本框中生成用户给定值的索引?

java - 我可以用 jqGrid 实现延迟加载吗?

javascript - 如何在没有数组作为键的情况下获取 JSON 数据?

javascript - 滚动时让右div在父div中滑动

ios - 如何使用 ECSlidingViewController 不完全隐藏菜单?