jquery 简单图像滑块 w/ajax

2024-02-20

我有一个页面,上面有很多图像,只想按需加载额外的图像。 IE,如果用户单击它或将鼠标悬停在上面,等等。我见过的大多数(如果不是全部)滑块都使用隐藏属性,所有元素都会立即加载,这在我的情况下会造成过度的负担。

我喜欢:http://nivo.dev7studios.com/ http://nivo.dev7studios.com/但它没有这样的功能。

有人知道最好使用 jquery 的 ajax 滑块吗?

Thanks


我认为你可以用 jcarousel 做到这一点:http://sorgalla.com/jcarousel/ http://sorgalla.com/jcarousel/

诀窍是在javascript中一张一张地传递图像,而不是在html中,如果没有,总是会预先加载。

代码是:

var mycarousel_itemList = [
{url:"/im/a.jpg", title: ""},{url:"/im/b.jpg", title: ""}];

listaimg=document.createElement('ul');
jQuery(listaimg).attr('id','mycarousel');
jQuery(listaimg).addClass('jcarousel-skin-tango');
jQuery('#containercarousel').append(listaimg);
jQuery('#mycarousel').jcarousel({   auto: 9,wrap: 'last', visible: 1,scroll:1, size: mycarousel_itemList.length,
    itemLoadCallback: {onBeforeAnimation: mycarousel_itemLoadCallback}

   });


function mycarousel_itemLoadCallback(carousel,state){for(var i=carousel.first;i<=carousel.last;i++){if(carousel.has(i)){continue}if(i>mycarousel_itemList.length){break};

carousel.add(i,mycarousel_getItemHTML(mycarousel_itemList[i-1]));


  }
};
function mycarousel_getItemHTML(item)
{


  var img = new Image();
                 $J(img).load(function () {

// whatever you want to do while loading.
    }).attr('src', item.url);
 return "<li><img src=\"" + item.url + "\" width=\"770\" alt=\"\" /></li>";

}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

jquery 简单图像滑块 w/ajax 的相关文章

  • 使用 jquery 生成网站的屏幕截图

    我想严格使用 javascript 生成任何给定 url 的屏幕截图缩略图 如果这无法完成 任何人都可以指出我使用自己的 api 执行此操作的正确方向吗 编辑我只是决定作弊并使用框架 因为无论如何 这是我为了好玩而做的事情 但是感谢所有出色
  • JQuery更新数据-属性

    考虑以下相册示例 相册的首页和最后一页是相册跨页大小的一半 我设置了attr data width and attr data width correct 用于比较 例如 checkImageDimesions 附加对象数据 不是简单的字符
  • 将毫秒转换为日期 (jQuery/JavaScript)

    我有点漫无目的 但我会尽力保持清晰 我很无聊 所以我正在做一个 呼喊箱 我对一件事有点困惑 我想获取输入消息的时间 并且想确保我获取服务器时间 或者至少确保我没有获取用户的本地时间 我知道没关系 因为这东西除了我之外不会被任何人使用 但我想
  • 如何使用 javascript 确定字符串是否只包含空格?

    如何使用 javascript 确定输入字符串是否仅包含空格 另一个好帖子 更快的 JavaScript 修剪 http blog stevenlevithan com archives faster trim javascript 您只需
  • Bootstrap 手风琴菜单不起作用

    我设计了一个如图所示的手风琴菜单 如果单击菜单 打开的菜单将关闭 这就是手风琴的功能 但在这个设计中 我逐个单击菜单 但前一个没有关闭 如何解决这个问题 提前致谢 jQuery document ready function var acc
  • 强制一个 javascript 函数等待运行,直到第一个函数完成

    下午 我遇到了一个问题 我需要运行一个函数 然后在完成后 运行下一个函数 并对四个函数执行此操作 我已经尝试了一段时间 试图找到正确的布局语法我的函数调用但似乎找不到任何东西来解决这个特定的场景 html div div div jquer
  • javascript获取字符前的字符串

    我有一个字符串 我正在尝试提取引号之前的字符 示例是提取14 from 14 14 99 我正在使用以下代码来实现此目的 menuItem text match 0 我的问题是 如果字符串类似于 0 88 我希望返回一个空字符串 不过我还是
  • jQuery背景颜色动画

    我有一个带有链接和 SPAN 的 DIV 单击链接时 它会使用 AJAX 呈现项目列表 单击某个项目时 SPAN 的内容会发生更改 我想通过将 DIV 的背景颜色设置为绿色并使用 jQuery 将其动画回白色来突出显示此更改 var ori
  • jQuery,如何制作同步动画?

    我的页面布局看起来像这样 image image image 当您将鼠标悬停在其中一张图像上时 我想制作一个动画以获得类似这样的效果 image hover image image or image image hover mage or
  • 如果未选中复选框,jquery 清除输入字段

    我有以下 jquery 如果选中复选框 用户可以填写表单中的其他字段 我想要的是如果未选中该复选框 则清除附加输入字段值 document ready function input checkbox attr checked false x
  • 在弹出警报框之前将其删除[重复]

    这个问题在这里已经有答案了 我正在尝试使用 Grease Monkey 和 jQuery 删除外部站点上的警报框 HTML p Hello world p GreaseMonkey 脚本 目前没有 jQuery 部分 UserScript
  • Jquery查找值为X的表格单元格

    我正在尝试寻找一个 td 其中值为 5 它是一个日历 因此只有一个 5 值 您可以使用filter https api jquery com filter method td filter function return this text
  • 禁用输入中的空格,并允许后退箭头?

    我试图禁用用户名文本字段中的空格 但是我的代码也禁用后退箭头 有什么办法也允许后退箭头吗 function var txt input UserName var func function txt val txt val replace s
  • jquery ajax可以调用外部webservice吗?

    jquery ajax代码可以调用吗网络服务来自另一个域名或另一个网站 像这样 ajax type POST url http AnotherWebSite com WebService asmx HelloWorld data name
  • 使用 parsley.js 支持每个字段多个自定义错误消息

    我正在尝试使用 parsley js 验证一个简单的表单 并且我对 parsley js 非常初学者 我想使用 window ParsleyValidator addValidator 方法在一个自定义验证方法中显示多个错误消息 所以我尝试
  • 如何在 jquery 中使 ajax 数据键动态化?

    我试图使内联编辑成为动态的 因此它只依赖于我的标记中的一些数据属性 所以现在的代码如下 inline edit editable function value settings var editableField this ajax typ
  • 使用 jQuery UI 日期选择器选择日历更改 URL

    我正在使用 jQuery UI 选择器 我想知道当有人选择日期时是否有可能 它会自动将他们重定向到 URL 如下所示 index php date 2013 10 15 这是我正在使用的插件 Date
  • 在 ASP.NET MVC 4 中使用 jQuery Mobile 1.3 面板时的双滚动条

    我无法弄清楚这一点 将以下代码放入布局页面并在浏览器中查看后 我将显示 2 个垂直滚动条 div div 遇到了类似的问题 并注意到只有在使用我的自定义主题时才出现这种问题 我以错误的顺序将自定义主题添加到页面 这导致了问题 正确的顺序是
  • 如何设置在浏览器的新选项卡(_blank)中打开的pdf文件的标题

    这是我的尝试 是否在新选项卡上打开 但它总是显示test pdf如题 function titlepath path name alert path alert name document title name window open pa
  • 限制 jQuery id 字符串吗?

    简而言之 我的问题是字符串在 jQuery 中作为可搜索 id 或可搜索内容有什么限制 更新 我得到了 ID 部分 但不是为什么我什至无法使用该字符串搜索 html 内容 对于任何愿意告诉我一个正则表达式来将模式从 MM dd yy HH

随机推荐