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

最新推荐文章于 2022-08-07 09:45:35 发布

zxt1985

最新推荐文章于 2022-08-07 09:45:35 发布

阅读量229

点赞数

分类专栏： jquery 文章标签： jcarousel jquery js ViewUI

本文链接：https://blog.csdn.net/zxt1985/article/details/84209506

版权

jquery 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

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

修改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>

效果图请看附件