本文实例讲述了jquery插件之文字间歇自动向上滚动效果代码。分享给大家供大家参考，具体如下：此插件旨在实现目前较为流行的文字间歇向上滚动特效，当鼠标移动到文字上时，向上滚动会停止，当鼠标离开时，向上滚动继续。整体代码如下：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta htt...
本文实例讲解了用jQuery中的ajax分页相关代码，分享给大家供大家参考，具体内容如下 把分页封装到一个jsp里，那么大家就可以通过include的方式引入分页的页面这里起名为page_ajax.jsp 本人封装后，使用者需要在页面中引入page_ajax.jsp，并且在查询列表的时候，点击按钮，调用自定义的方法，如myFunction（），在这个方法里头，调用自己拓展的jquer方法，$.pageAjax(url,functionName,showDIv); 这里的url是你要请求的ajax的url，f...
本文实例讲述了jQuery插件实现表格隔行变色及鼠标滑过高亮显示效果的方法。分享给大家供大家参考，具体如下： 此插件旨在实现表格隔行变色，且鼠标移动在表格的某一行上时，该行能高亮显示。整体代码如下：表格隔行变色且鼠标滑过高亮显示table{border-collapse:collapse;border:none;width:20%;} table tr td{border:1px solid #ccc;text-align:center;cursor:pointer;} .evenRow{background:#f0f0f0;} .oddRow{background:#ff0;}...
本文实例讲述了jQuery插件实现文字无缝向上滚动效果代码。分享给大家供大家参考，具体如下： 此插件旨在实现目前较为流行的无缝向上滚动特效，当鼠标移动到文字上时，向上滚动会停止，当鼠标离开时，向上滚动继续。整体代码如下：无缝向上滚动*{margin:0;padding:0;font-size:12px;} li{list-style:none;} .box{margin:20px;width:320px;height:195px;border:1px solid #ddd;padding:10px;overflow:hidden;} .box ul li{line-heigh...
前些文章用写过，省市县三级联动，但是感觉选择的时候不够直观，现在改进了下，效果如下图#provinceDiv{ list-style:none;} #provinceDiv li{ list-style:none; border-bottom:1px dotted #ccc; width:400px; height:20px;margin-bottom:3px;} #provinceDiv li span{ display:block; width:60px; height:20px; float:left; line-height:20px; text-align:center; position:relative;} #provinceDiv li span:hover{ background:#fb0...
朋友给我看了一个轮播效果，把js下载一看，丫丫的一个这么简单的效果，这么的就能写个几百行的，严重影响浏览器加载速度嘛，以为人家宽带流量不要钱玩的哦。。无奈之下给他写了个简单的，把所有代码放上去都没有超过70行，还有圆角的那个CSS，不是每个浏览器都是圆角的，不过不影响美观，嘻嘻。 先给大家展示下效果图：无标题页.clear{overflow:hidden; clear:both; width:0px; height:0px; } .imgbox{width:640px; margin:0 auto;...
jQuery是一款优秀的JavaScript库，它在WEB开发者和网页设计师中非常出名，帮助网页设计师开发出很多有创意和漂亮的WEB页面。 本文主要分享了12个有用的jQuery技巧，具体内容如下 下面是我收集的一些小技巧，这些技巧将帮助你提高你网站布局和应用的创意性以及功能性。 一、在新窗口打开链接 用这个代码，你点击超文本链接时会在新窗口中打开，为用户带来更好的体验：$(document).ready(function() {//select all anchor tags that ...
这是一款基于jQuery的百叶窗焦点图动画，和之前介绍的CSS3百叶窗焦点图动画不同的是，它的兼容性更好，实用性更强，因为它是基于纯jQuery的，基本上所有浏览器都能够支持。焦点图的图片切换动画是百叶窗的动画方式，但也有几种不同的百叶窗动画，因此也不会觉得单调。在线演示 源码下载 HTML代码CSS代码#slider { position: relative; width: 600px; overflow: hidden; margin: 10px auto 30px auto; } #slider li { position:...
在没给大家做详细文字说明之前，先给大家分享一段简单的jquery实现放大镜效果代码，需要的朋友可以直接拿去代码。$(function(){ var mouseX = 0; //鼠标移动的位置X var mouseY = 0; //鼠标移动的位置Y var maxLeft = 0; //最右边 var maxTop = 0; //最下边 var markLeft = 0; //放大镜移动的左部距离 var markTop = 0; //放大镜移动的顶部距离 var perX = 0; //移动的X百分比 var perY = 0; //移动的Y百分比 var bigLeft = 0; //大...
废话不多说了，直接给大家贴jquery代码了，具体代码如下所示：Title1 2 3 4/*************初始化************/ *{margin:0;padding: 0;border: none;list-style: none} /*********轮播左右居中*************/ .main{ width: 1024px; height: 320px; margin: 0 auto; position: relative; } .main a{ position: absolute; } .main a img{ width: 100%; height: 320px; } /***********左边小图标************/ .main ul li.selected{...
本文实例讲述了jQuery实现的多滑动门，多选项卡效果。分享给大家供大家参考，具体如下： 运行效果截图如下：具体代码如下：超多滑动门效果* {margin:0;padding:0; } body {font-size:12px; } ul, li {list-style-type:none; } #tab {width:500px;height:200px;margin:20px auto;overflow:hidden; } #tab .tab_title {width:500px;height:22px;overflow:hidden;left:0;top:0;clear:both;overflow:hidden;position:relative; } #tab ...
本文实例讲述了jQuery实现的精美平滑二级下拉菜单效果。分享给大家供大家参考，具体如下： 这是一款jQurey实现的向下二级导航菜单效果。效果非常不错，由上到下平滑延伸，给人的感觉协调唯美！js与html代码结构简单明了，便于使用与修改！ 运行效果截图如下：具体代码如下：jQuery实现精美二级菜单——js特效大全* { margin:0; padding:0; } body { font:12px/normal Arial, Helvetica, sans-serif; } ul, ol { list-style:none; }...
废话不多说了，直接给大家贴代码了，具体代码如下所示：jQuery图片轮播(焦点图)插件jQuery(function($){ $('#demo1').slideBox(); $('#demo2').slideBox({ direction : 'top',//left,top#方向 duration : 0.3,//滚动持续时间，单位：秒 easing : 'linear',//swing,linear//滚动特效 delay : 5,//滚动延迟时间，单位：秒 startIndex : 1//初始焦点顺序 }); $('#demo3').slideBox({ duration : 0.3,//滚动持续时间，单位：秒 easing ...
废话不多说了，直接给大家贴代码了，具体代码如下所示：var str = ''; if(page=="") page=1; var stop=true;//触发开关，防止多次调用事件 $(window).scroll( function(event){ //当内容滚动到底部时加载新的内容 100当距离最底部100个像素时开始加载. if ($(this).scrollTop() + $(window).height() + 10 >= $(document).height() && $(this).scrollTop() > 10) { //if(stop==true){ //stop=false; //var canshu="page/"+pag...
我们在很多网站看到，当我们滚动网页时，网页内的广告或某个小区域并不会消失，而是浮动在屏幕的某个地方，特别是一些局域广告。那么这是怎么实现的呢？本文将引用乌徒帮的跟随屏幕滚动代码，对此效果做详解。 一、原始代码 下面是乌徒帮的跟随屏幕滚动代码，它的作用域为乌徒帮网页两侧的边栏，以及双击屏幕后的右侧隐藏栏。var $catalogueOffsetTop = $('aside#catalogue').offset().top; var $archiveOffestTop = $('aside#arch...