展开菜单

jQuery插件bxSlider+zoomsl实现商城商品图片轮播放大镜效果

jQuery插件bxSlider+zoomsl实现商城商品图片轮播放大镜效果

bxSlider.js是一款jquery轮播图插件,可以实现图片并排轮播切换;zoomsl.js是一款jQuery图片放大镜效果插件,可以实现鼠标悬停放大显示图片细节;两个插件结合就可以实现类似于淘宝商品页页的产品轮播和放大显示效果。 bxSlider Github:https://github.com/stevenwanderski/bxslider-4 zoomsl官网:http://zoomsl.sergeland.ru/ 实现代码 引用插件: PS:自行前往官网或Github下载jQuery库、zo...

五张图 中间图片放大展示的jQuery图片滚动插件兼容IE6

五张图 中间图片放大展示的jQuery图片滚动插件兼容IE6

五图并列,中间图片放大展示的jQuery图片滚动插件,点击产品图片,或者点击左右箭头,或者拖动顶部的滚动条,产品图片就会放大显示,并且可以左右滚动。产品图片下面即是产品的名称和简略的描述,有利于SEO。 使用方法: 1、在head引入下面的css代码: <style type="text/css"> *{margin:0;padding:0;list-style-type:none;} a,img{border:0;text-decoration:none;} body{font:12px/180% Arial, He...

jquery实现单行文字循环上翻滚动播报效果(新闻滚动效果)

jquery实现单行文字循环上翻滚动播报效果(新闻滚动效果)

常见的网站单行新闻公告上翻播放的效果。 jQuery代码: function b(){ t = parseInt(x.css('top')); y.css('top','19px'); x.animate({top: t - 19 + 'px'},'slow'); //19为每个li的高度 if(Math.abs(t) == h-19){ //19为每个li的高度 y.animate({top:'0px'},'slow'); z=x; x=y; y=z; } setTimeout(b,3000);//...

jQuery跑马灯实现教程 使用jQuery简单实现产品展示的图片左右滚动功能

jQuery跑马灯实现教程 使用jQuery简单实现产品展示的图片左右滚动功能

原理比较简单:将要滚动显示的区域的CSS的override设为hidden,宽度设成一个比较大的值,如4000px,然后每次点击上一页或下一页的 按钮时,计算当前页数,如果已经到了最后一页,则回到第一页,滚动是通过控制div的left属性实现的,需要两个div,外面的div的 position设为retative,里面的DIV的position设为absolute。 HTML代码: <div id="product"> <h2><span class="arrow">arrow</span>产品展...

jQuery实现渐变效果的下拉导航菜单

HTML代码: <div id="nav"> <ul> <li> <a href="http://neirong.org" target="_blank">资源共享</a> <ul> <li><a href="http://neirong.org" target="_blank">资源共享</a></li> <li><a href="http://neirong.org" target="_blank...

JavaScript 图片变换效果封装 只支持IE浏览器

JavaScript 图片变换效果封装 只支持IE浏览器

这个javascript做的效果最早在sina看到,这里把这个效果封装好方便使用。纯js仿照常见的图片变换flash做的效果,但是滤镜变换只对应ie有效,firefox浏览器只能看到一般的切换效果。 程序说明: 图片未开始转换时,由于没有图片会显示一个红x,所以隐藏图片: this._img.style.visibility = "hidden"; ps:以前我用this._img.src = "javascript:void(0);";但这个在ie8会出错。 这个变换效果需要滤镜,所以只支持ie。要使用变换...

超级简单的网站滚动新闻jQuery文字跑马灯渐入渐出幻灯片效果

超级简单的网站滚动新闻jQuery文字跑马灯渐入渐出幻灯片效果

特效效果看图片: 代码下载地址:http://pan.baidu.com/s/1vh7kd