jquery cycle.js 分页器图形在 Safari、Firefox、Chrome 和 Opera 中工作,但在 IE 中消失

Posted

技术标签:

【中文标题】jquery cycle.js 分页器图形在 Safari、Firefox、Chrome 和 Opera 中工作,但在 IE 中消失【英文标题】:jquery cycle.js pager graphics work in Safari, Firefox, Chrome and Opera but disappear in IE 【发布时间】:2010-02-12 16:57:24 【问题描述】:

我终于启动并运行了我的网站。我是平面设计师而不是程序员,所以是新手。就代码而言,它可能不是最漂亮的,但它确实有效。如果您访问我网站的工作部分http://www.maryhutchisondesign.com,寻呼机(我使用背景 gif 表示 a 和活动状态)功能在 Safari、Chrome、Firefox 和 Opera 中有效,但在 Internet Explorer 中消失了。我收到了 Mike Alsup 通过电子邮件发送给我的 pagerAnchorBuilder 行。有什么我做错了吗?这是css和js的示例。当我从 malsups 高级寻呼机演示中复制代码时,它也适用于图像缩略图,但在 IE 中它会移动主要投资组合图像的位置。

.nav_ocn li   
 width: 10px;  
 float: left;  
 margin: 5px;  
 list-style: none;  
 margin-left: 0px;  
  
.nav_ocn a   
 border: 0px solid #ccc;  
 text-decoration: none;  
 margin: -1px; 
 padding: 10px;  
 background-image: url(../images/pager.gif);  
 background-repeat: no-repeat;  
 background-position: left;  
 
.nav_ocn a.activeSlide   
 background-image: url(../images/pager_select.gif);  
 background-repeat: no-repeat;  
 background-position: left;  
  
.nav_ocn a:focus  outline: none;   

$(document).ready(function() 
    $('#OCN_gallery').cycle(
        fx:     'scrollLeft', 
    next:   '#OCN_gallery',
    speed:  'fast', 
    timeout:  0,
    pause:   1,
    pager:   '.nav_ocn',

    // callback fn that creates a thumbnail to use as pager anchor 
    pagerAnchorBuilder: function()  
        return '<li><a href="#"</a></li>'; 
    
    );

);

任何帮助和内部将不胜感激。

谢谢,

玛丽

【问题讨论】:

【参考方案1】:

改变

return '&lt;li&gt;&lt;a href="#"&lt;/a&gt;&lt;/li&gt;';

return '&lt;li&gt;&lt;a href="#"&gt;&lt;/a&gt;&lt;/li&gt;';

缺少一个“>”,IE 无法像其他浏览器那样处理。

【讨论】:

以上是关于jquery cycle.js 分页器图形在 Safari、Firefox、Chrome 和 Opera 中工作,但在 IE 中消失的主要内容,如果未能解决你的问题,请参考以下文章

JavaScript 如何在jquery循环插件中更改分页器文本

超好用的一个JQUERY分页器-jpaginate

jQuery Lightslider 插件分页器 onclick 事件

Jquery 循环 - 在不破坏缩略图分页器的情况下将图像包装在 div 标签中

一例基于thinkphp,jquery和bootstrap渲染的查询数据分页器

jquery tablesorter 寻呼机不工作