今天给大家分享一款基于jQuery带标题的图片3D切换焦点图。这款焦点图适用浏览器:IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗。

实现的代码。

html代码:

<div id="wowslider-container">
<div class="ws_images">
<ul>
<li><a href="#">
<img src="data:images/data/images/slide1.png" alt="123" title="" /></a></li>
<li><a href="#">
<img src="data:images/data/images/slide2.png" alt="456" title="标题1234" /></a>标题1234</li>
<li><a href="#">
<img src="data:images/data/images/slide3.png" alt="789" title="标题1234" /></a>标题1234</li>
<li>
<iframe width="100%" height="100%" src="https://www.youtube.com/embed/_GOt0sMIZVY?autoplay=0&rel=0&enablejsapi=1&playerapiid=ytplayer&wmode=transparent"
frameborder="0" allowfullscreen></iframe>
<img src="data:images/data/images/slide5new.jpg" alt="012" title="" /></li>
</ul>
</div>
<div class="ws_bullets">
<div>
<a href="#">
<img src="data:images/data/tooltips/slide1.png" alt="CSS3 Slider" /></a> <a href="#">
<img src="data:images/data/tooltips/slide2.png" alt="CSS Slideshow" /></a> <a href="#">
<img src="data:images/data/tooltips/slide3.png" alt="CSS Gallery" /></a>
<a href="#">
<img src="data:images/data/tooltips/slide5new.jpg" alt="Video Support" /></a>
</div>
</div>
</div>
<script type="text/javascript" src="data:images/engine/wowslider.js"></script>
<script type="text/javascript" src="data:images/engine/script.js"></script>

基于jQuery带标题的图片3D切换焦点图的更多相关文章

  1. 基于jquery鼠标点击图片翻开切换效果

    基于jquery鼠标点击图片翻开切换效果是一款基于jQuery+CSS3实现的点击图片切换特效.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div class=&quo ...

  2. 基于jquery仿360网站图片选项卡切换代码

    今天给大家分享一款基于jquery仿360网站图片选项卡切换代码.这款实例适用浏览器:IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗.效果图如下: 在线预 ...

  3. 基于jq流畅度非常好的图片左右切换焦点图

    今天给大家分享一款基于jq流畅度非常好的图片左右切换焦点图.这是一款基于jQuery实现的支持鼠标拖动切换jQuery特效下载.效果图如下: 在线预览   源码下载 实现的代码. html代码: &l ...

  4. 基于jQuery自适应宽度跟高度可自定义焦点图

    基于jQuery自适应宽度跟高度可自定义焦点图.这是一款带左右箭头,缩略小图切换的jQuery相册代码.效果图如下: 在线预览   源码下载 实现的代码. html代码: <section cl ...

  5. 一款基于jQuery的支持鼠标拖拽滑动焦点图

    记得之前我们分享过一款jQuery全屏广告图片焦点图,图片切换效果还不错.今天我们要分享另外一款jQuery焦点图插件,它的特点是支持鼠标拖拽滑动,所以在移动设备上使用更加方便,你只要用手指滑动屏幕即 ...

  6. jQuery图片分组切换焦点图

    在线演示 本地下载

  7. jQuery图片下滑切换焦点图

    在线演示 本地下载

  8. 基于jquery带时间轴的图片轮播切换代码

    基于jquery图片标题随小圆点放大切换.这是是一款带时间轴的图片轮播切换代码.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div id="decoroll2 ...

  9. 基于jQuery带进度条全屏图片轮播代码

    基于jQuery带进度条全屏图片轮播代码.这是一款基于jQuery实现的oppo手机官网首页带进度条全屏图片轮播特效.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div ...

随机推荐

  1. 微信訪问页面,莫名其妙刷新两次,火狐、谷歌、ie无问题

    做微信刮刮卡活动,有个用户刮奖次数的限制,昨天一切正常,所以就修改了一些东西,今天再打开的时候刮奖次数第一次是1,第二次是3,第三次是5.感觉就是页面刷新了两遍. 检查前后台代码.发现一些bug就顺手 ...

  2. Egret初体验–躲避类小游戏

    下面简单介绍一下我这个游戏:基本上就3个画面(准备再添加一个胜利的界面)开始画面,一个按钮,点击进入游戏游戏画面,滚动的背景,触摸移动的老鹰,从天而降的翔,以及右上角的时间条结束画面,显示结果,关注按 ...

  3. node.js(八) 有趣的东西才开始哦

    ### Express介绍 npm提供了大量的第三方模块,其中不乏许多Web框架,比如我们本章节要讲述的一个轻量级的Web框架 ——— Express. Express是一个简洁.灵活的node.js ...

  4. Ant 简易教程

    转载:http://www.cnblogs.com/jingmoxukong/p/4433945.html Ant 简易教程 Apache Ant,是一个将软件编译.测试.部署等步骤联系在一起加以自动 ...

  5. NavigationBar--修改返回按钮的标题

    UIBarButtonItem *backItem = [[[UIBarButtonItem alloc] init] autorelease]; backItem.title = @"返回 ...

  6. maven 引用自己的jar

    <build>    <plugins>        <plugin>            <groupId>org.apache.maven.pl ...

  7. android:visibility

    RelativeLayout android:visibility="gone/visible/invisible" 此属性意思是此视图是否显示 例如RelativeLayout中 ...

  8. Cookies与保持登录(新浪微博的简单模拟登录)

    Cookies与保持登录(新浪微博的简单登录) .note-content {font-family: "Helvetica Neue",Arial,"Hiragino ...

  9. 2 kNN-K-Nearest Neighbors algorithm k邻近算法(二)

    2.3 示例:手写识别系统 2.3 .1 准备数据:将图像转换为测试向量 训练样本:trainingDigits 2000个例子,每个数字大约200个样本 测试数据:testDigits 大约900个 ...

  10. Oracle EBS-SQL (SYS-3):sys_人员用户名对应关系查询.sql

    select fu.user_name 用户名,       fu.description 描述,       (select ppf.FULL_NAME          from per_peop ...