`
moonlight2010
  • 浏览: 20042 次
  • 性别: Icon_minigender_1
  • 来自: 青岛
社区版块
存档分类
最新评论

图片轮播插件slideBox

阅读更多

转载地址:http://www.ido321.com/852.html

 说明:兼容ie8,firfox,chrome

使用说明

1,引入js

<script type="text/javascript" src="<%=path%>/assets/js/jquery-1.8.2.min.js"></script>

<script type="text/javascript" src="<%=path%>/assets/js/jquery.slideBox.min.js"></script>

2,css引入

<link rel="stylesheet" type="text/css" href="<%=path%>/assets/css/jquery.slideBox.css" />

3,body中内容

<div style="float:left;margin-top:0px;" class="slideBox" id="demo4">

 

  <ul class="items">

    <li><a href="javascript:void(0)" title=""><img src="<%=path%>/assets/images/picStore/first.png" width="480px" height="260px"></a></li>

    <li><a href="javascript:void(0)" title=""><img src="<%=path%>/assets/images/picStore/second.png" width="480px" height="260px"></a></li>

    <li><a href="javascript:void(0)" title=""><img src="<%=path%>/assets/images/picStore/three.png" width="480px" height="260px"></a></li>

    <li><a href="javascript:void(0)" title=""><img src="<%=path%>/assets/images/picStore/fourth.png" width="480px" height="260px"></a></li>

  </ul>

 

4,js

 

<script type="text/javascript">

$(document).ready(function(){

//启动滚动图片

$('#demo4').slideBox({

hideBottomBar : false//隐藏底栏

});

});

 

效果地址:http://slidebox.sinaapp.com/

分享到:
评论

相关推荐

    onethink 图片轮播插件整合slideBox,带管理

    onethink 图片轮播插件整合slideBox,带管理界面,自定义4种效果,显示大小可控 初学根据links插件改写的,有需要的拿去学习,由于是初学的,不喜勿喷!欢迎大家一起交流

    jquery图片滚动插件slideBox

    SlideBox是一款基于jQuery的轻量级图片轮播插件,它提供了丰富的自定义选项和简洁的API接口,使得开发者能够轻松创建出各种个性化的图片滚动效果。SlideBox的特点包括自动播放、手动切换、图片预加载、动态指示器等...

    jQuery图片轮播(焦点图)插件jquery.slideBox

    jQuery图片轮播(焦点图)插件jquery.slideBox兼容IE6+,Chrome,Firefox,Opera,safari,可左右,可上下,可快可慢,可指定默认显示第N张,自由设定,代码简洁,运行效率高演示地址:...

    jquery slidebox图片切换插件多种新闻焦点图片滑动切换

    jQuery Slidebox图片切换插件就是这样一个工具,它能帮助开发者轻松实现新闻焦点图片的滑动切换,为网站增添视觉魅力。本文将深入探讨jQuery Slidebox的核心原理、功能特性以及实际应用,旨在帮助读者全面理解并掌握...

    轻量级jQuery插件slideBox实现带底栏轮播(焦点图)代码

    jQuery插件slideBox是一种轻量级的图片轮播(焦点图)插件,它能够实现带有底栏的图片轮播功能。这一插件之所以被称为轻量级,是因为它的代码量相对较小,加载速度快,不会给网页的加载时间造成太大的负担。slideBox...

    jquery slideBox

    jQuery SlideBox是一款基于JavaScript库jQuery的轻量级轮播插件,主要用于实现图片或内容的自动滑动展示。其核心特性包括自动播放、手动控制、过渡效果等,为网页设计提供了丰富的自定义选项,可以适应各种风格和...

    jquery slidebox jquery slidebox

    jQuery Slidebox是一款基于jQuery库的滑动盒组件,它提供了丰富的功能和自定义选项,用于创建各种动态展示效果,如图片轮播、内容滑动、菜单折叠等。Slidebox是网页设计中常用的交互元素,可以增强用户体验,使网站...

    绝对可用jquery.slideBox

    其中,滑动框(SlideBox)作为一种常见的展示图片、内容或者广告的方式,深受开发者喜爱。本文将详细介绍一个名为“jQuery.slideBox”的插件,它是经过实际测试,证明在网页中能够稳定运行的有效解决方案。 jQuery....

    图片滚动左右切换jquery插件

    **jQuery图片滚动插件详解** ...通过理解和运用这一插件,开发者可以快速构建出具有专业水平的图片轮播效果,提升网站的用户体验。无论是在商业项目还是个人作品中,这样的工具都能为网页增添亮点。

    jQuery焦点图切换特效插件封装实例

    1. 插件初始化:定义一个函数,比如slideBox,该函数接受一个参数options,用于在创建插件实例时设定特定的行为和样式。 2. 设定默认选项:在插件内部设置默认的配置选项,比如轮播方向(direction)、动画持续时间...

    JAVA毕业设计源码,门户网站,SSH框架

    - **slideBox** 是一个图片轮播插件,通常用于展示网站的特色内容或产品。它利用jQuery库实现图片的自动切换、导航按钮控制和过渡效果,为网站添加视觉吸引力。 在实际开发过程中,开发者会结合HTML、CSS和...

    mui api 中文文档

    - **Swipe**: 图片轮播插件,支持手势操作和多种过渡效果。 - **SlideBox**: 展示多张图片或内容的滑动盒子组件。 4. **性能优化** - **预加载策略**: MUI 提供了预加载页面资源的方法,减少页面加载等待时间。 ...

Global site tag (gtag.js) - Google Analytics