在Table标签上设置 class="sortable" 且Table要设置ID. 表中增加了两行代码是JQuery写的.用于给奇偶行变色. 代码如下:addEvent(window, "load", sortables_init); var SORT_COLUMN_INDEX; function sortables_init() { // Find all tables with class sortable and make them sortable if (!document.getElementsByTagName) return; tbls = document.getElementsByTagName("table"); for (ti=0;ti<tbls.length;ti++) { thisTbl = ...
jQuery版本：1.3.2 代码如下:<html> <head> <script src="jquery-1.3.2.min.js" type="text/javascript"></script> </head> <body> <input type="checkbox" name="chk_list" id="chk_list_1" value="1" />1<br /> <input type="checkbox" name="chk_list" id="chk_list_2" value="2" />2<br /> <input type="checkbox" name="chk_list" id="chk_list_3" value="3" />3<br /> <input type="checkbox" name="chk_list" id="chk_list...
从那以后，我找到了很多可以让访客通过鼠标点击某个地方切换样式表的方法。但最近我要写一篇如何 使用jQuery编写简单代码实现它的教程。 我将向你们逐步解说整个的过程，不仅仅因为要展示jQuery代码的简介，同时也要揭示jQuery库中的若干高级特性。 首先，代码 代码如下:$(document).ready(function() { $(.styleswitch).click(function() { switchStylestyle(this.getAttribute("rel")); return false; }); var c = readCookie(s...
下面的代码。大家可以研究下，对于jquery的学习还是非常有好处的。锋利的jquery中的一句话代码，实现的菜单运行后，需要刷新下(因为是调用的外地jquery)1-5-1 #menu { width:300px; } .has_children{ background : #555; color :#fff; cursor:pointer; } .highlight{ color : #fff; background : green; } div{ padding:0; } div a{ background : #888; display : none; float:left; width:300px; } //等待dom元素加载完毕...
1、复选框全选操作：其实说到底就是对Jquery 选择器的运用，点我查看Jquery选择器 html代码: 代码如下:<form> 您爱好的运动是： <input type="checkbox" name="item" value="football"/> football <input type="checkbox" name="item" value="basketball"/> basketball <input type="checkbox" name="item" value="badminton"/> badminton <input type="checkbox" name="item" value="pingpong"/> pingpong <input type="button" ...
经过分析，网上的参考，终于搞定了~~ jQuery插件代码： 代码如下:jQuery.fn.selectItem = function(targetId) { var _seft = this; var targetId = $(targetId); this.toggle( function() { var A_top = $(this).offset().top + $(this).outerHeight(true); // 1 var A_left = $(this).offset().left; targetId.bgiframe(); targetId.show().css({ "position": "absolute", "top": A_top + "px", "left": A_left + "px" }); } , f...
直接看代码： 代码如下:<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Layer.aspx.cs" Inherits="Layer" %> <!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 runat="server"> <title></title> <script src="jquery-1.3.2.js" type="text/javascript"></script> <script src="jquery....
以前的我，用惯了 UpdatePanel UpdateProgress 等控件，甚至到了滥用的程度，只是一味的追求无刷新，一边弄这 loading 图片 提示，这样貌似更美观，但是 感觉 更损失了性能， 而且有时候还破坏了网站的完整性。 但是学了Jquery之后，了解了 Jquery.ajax ,Jquery.get 等方法，从而学会了使用 webservice 和.ashx 文件，来与服务器交互。 这次的Jquery分页 是与 .ashx文件配合的。 建立三个.ashx，分别为PreviewHandler.ashx,PageHan...
即一条新闻滚 进视图之后，会暂停几秒钟，然后继续向上2滚动，淡出视图，同时，下一条新闻接着滚入视图。这次主要是用jquery来开发这个功能，里面肯定有许多不足 之处，欢迎大家点评。 先粘贴一下代码， 代码如下:<style> <%-- #news-feed { padding: 0; margin: 0 0 0 10px; position: relative; height: 200px; width: 17em; overflow: hidden; } .headline { position: absolute; height: 200px; top: 210px; overflow: hidden...
jQuery与javascript对照学习(获取父子前后元素) .c1{background-color:green;padding:20px;} .c2{background-color:red;padding:20px;} .c1 div{background-color:gray;} function fNext(obj){//许多时候需要元素之间没有间隙才能取到 //alert(obj.nextSibling.id); alert(jQuery(obj).next().attr("id"));//传递this，通过$(obj)转化为jQuery对象 } function fPrev(obj){ //alert(obj.previousSibling.id); alert(jQuery(...
使用 jquery 框架：下载 jquery.js 新建一个 web 工程 ajax ； 在 webRoot 下新建一个 jslib 文件夹：专门存放 js 文件； 在 webRoot 下新建一个 html/jsp 页面： login.html 代码如下:<script type = "text/javascript" src = "jslib/jquery.js"></ script> <script type = "text/javascript" src = "jslib/verify.js"></ script> </ head> <body> <h1> 用户校验 </ h1> <!-- ajax 中可以不用 form 表单的提交 --> <!--input 标签...
页面滚动时随着滚动条固定在屏幕的中央，模式对话框中的内容为两种，一是iframe引入，一是HTML语句插入。在网站开发中十分常用，使用该插件十分的简单。来看一下运行效果。插件使用 1、首先引入样式文件，详细代码如下所示： <link href="images/blue/css.css" rel="stylesheet" type="text/css" id="showdialogcss" /> 着里面的id一定不要忘记，他是用于切换插件皮肤的。 2、接着引入jQuery的js文件，具体代码如下： <script src=...
代码如下:<script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript"> $(function(){ $("li").hover(function(){ $(this).addClass("ho"); }, function(){ $(this).removeClass("ho"); }); $("li").click(function(){ $(this).removeClass("ho").addClass("xiaoshi").siblings().removeClass("xiaoshi"); }); }) </script> <style type="text/css"> li{background-color:#099; float:left;...
#menu{width:200px;} .has{background:#00DFAA; color:#FFFBF0; cursor:pointer} .hig{background:#FF5F55; color:#2A3F55;} div{padding:0px; margin:10px 0;} div a{background:#D41FAA; display:none; float:left; width:200px;} $(document).ready(function(){ $(".has").click(function(){ $(this).addClass("hig").children("a").show().end().siblings().removeClass("hig").children("a").hide(); }); }); 第一章 ...
代码如下:<!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 http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>JQuery 浮动导航栏</title> <script type="text/javascript" src="http://img.jb51.net/jslib/jquery/jquery-1.3.2.min.js"></script> <style type="...