`
zxt1985
  • 浏览: 20833 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

jquery.jcarousel设置图片左右浮动效果

jcarouseljqueryjs
阅读更多
    jquery.jcarousel是一个很强大的图片滚动插件，关于它的使用和配置，我就不重复说明了，因为你一百度或谷歌就能搜出一大堆的说明文档，并且它自带的api说明也很详细。现在我只想和大家一起分享如何修改它的左右浮动效果，它默认的float是left，有的时候我们需要右对齐，这时该怎么办呢？其实不用修改它的js代码，只需修改skin.css和你的页面文件即可。

修改skin.css文件：（可选，视自己具体情况而定） 
.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-prev-horizontal {
    left: auto;
    right: -38px;//左箭头：此处把0px修改成你自己想要的值，就能把箭头图标往左边移    
    background-image: url(default/img/right-btn.png);
}

.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-next-horizontal {
    left: -32px;//右箭头：此处把0px修改成你自己想要的值，就能把箭头图标往右边移    
    right: auto;
    background-image: url(default/img/left-btn.png);
}

修改你的页面文件：（必选） 
<html xmlns="http://www.w3.org/1999/xhtml" dir="rtl"><!-- 加上这个dir="rtl"就能使整个图片的float为right浮动了，不加就为left浮动了，是不是很简单，你可以试试，嘿嘿 -->
<head>
...
</head>
<body>
...
</body>
</html>


效果图请看附件
  • 描述: 这是右浮动
  • 大小: 12.5 KB
  • 描述: 这是左浮动
  • 大小: 12.4 KB
分享到：
| tomcat集群和负载均衡的实现（session同步 ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics