基于jQuery带标题的图片3D切换焦点图
今天给大家分享一款基于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切换焦点图的更多相关文章
- 基于jquery鼠标点击图片翻开切换效果
基于jquery鼠标点击图片翻开切换效果是一款基于jQuery+CSS3实现的点击图片切换特效.效果图如下: 在线预览 源码下载 实现的代码. html代码: <div class=&quo ...
- 基于jquery仿360网站图片选项卡切换代码
今天给大家分享一款基于jquery仿360网站图片选项卡切换代码.这款实例适用浏览器:IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗.效果图如下: 在线预 ...
- 基于jq流畅度非常好的图片左右切换焦点图
今天给大家分享一款基于jq流畅度非常好的图片左右切换焦点图.这是一款基于jQuery实现的支持鼠标拖动切换jQuery特效下载.效果图如下: 在线预览 源码下载 实现的代码. html代码: &l ...
- 基于jQuery自适应宽度跟高度可自定义焦点图
基于jQuery自适应宽度跟高度可自定义焦点图.这是一款带左右箭头,缩略小图切换的jQuery相册代码.效果图如下: 在线预览 源码下载 实现的代码. html代码: <section cl ...
- 一款基于jQuery的支持鼠标拖拽滑动焦点图
记得之前我们分享过一款jQuery全屏广告图片焦点图,图片切换效果还不错.今天我们要分享另外一款jQuery焦点图插件,它的特点是支持鼠标拖拽滑动,所以在移动设备上使用更加方便,你只要用手指滑动屏幕即 ...
- jQuery图片分组切换焦点图
在线演示 本地下载
- jQuery图片下滑切换焦点图
在线演示 本地下载
- 基于jquery带时间轴的图片轮播切换代码
基于jquery图片标题随小圆点放大切换.这是是一款带时间轴的图片轮播切换代码.效果图如下: 在线预览 源码下载 实现的代码. html代码: <div id="decoroll2 ...
- 基于jQuery带进度条全屏图片轮播代码
基于jQuery带进度条全屏图片轮播代码.这是一款基于jQuery实现的oppo手机官网首页带进度条全屏图片轮播特效.效果图如下: 在线预览 源码下载 实现的代码. html代码: <div ...
随机推荐
- C#编程建言笔记
方法: 1.方法(静态或实例)JIT编译后,在内存中的代码段上都是一个全局函数,且只存在一份拷贝. 2.方法修饰符:保护级别,静态,虚函数:方法签名:返回值,函数名,参数. 构造器: 1.一个方法只能 ...
- 学习Java这几个快捷键你得知道(不断更新中)
java中的System.out.println();的快捷键 --------先输入sysout 在按 alt + /
- JS继承,原型继承,构造函数的继承,非构造函数"的继承
a.原型继承 一.new运算符的缺点 用构造函数生成实例对象,有一个缺点,那就是无法共享属性和方法.比如,在DOG对象的构造函数中,设置一个实例对象的共有属性species. function DOG ...
- 动态设置 GridView 列宽
/// <summary> /// 设置简单评语列的宽度 /// </summary> /// <param name=&quo ...
- 好博客分享 go需要运行容器? 不需要
http://blog.csdn.net/wsl211511/article/details/51645324 粗浅看 Tomcat中设计模式分析 http://www.infoq.com/cn/ar ...
- Ubuntu14.04(64位)安装ATI_Radeon_R7_M265显卡驱动
电脑型号:Dell inspiron 14-5447 笔记本 显卡配置:集成显卡Intel核心显卡,Cpu是i5-4210U;独立显卡ATI_Radeon_R7_M265 网上关于ATI/Intel双 ...
- struts2中使用ognl表达式时各种符号的使用规则$,#,%
OGNL表达式struts2标签“%,#,$” 一.什么是OGNL,有什么特点? OGNL(Object-Graph Navigation Language),大概可以理解为:对象图形化导航语言.是一 ...
- 《转》Java 信号量 Semaphore 介绍
该文章转自:http://www.cnblogs.com/whgw/archive/2011/09/29/2195555.html Semaphore当前在多线程环境下被扩放使用,操作系统的信号量是个 ...
- jQuery 之 $.get、$.post、$.getJSON、$.ajax
对 JSTL标签 加以巩固,同时在自己的博客中与之分享: http://app.yinxiang.com/shard/s20/sh/76feadb0-957a-40bc-895d-4d28025ce2 ...
- IE兼容性bug汇总
1.IE6的双边距BUG. 发生条件:如果有元素是浮动元素,则该元素与它的父元素(一般是一个容器)直接相接触(中间不能隔着其他元素)的左或右的边距就会产生双倍边距,也意味着相邻的兄弟元素不可能会产生双 ...