代码如下: 脚本之家 选项卡效果 www.gxlcms.com /* 选项卡封装 by 井底的蛙 2008-2-4 */ opCard = function() { this.bind = new Array(); this.index = 0; //默认显示哪个选项卡,从0开始 this.style = new Array(); //["","",""] this.overStyle = false; //选项是否有over, out变换样式事件,样式为this.style[2] this.overChange = false; //内容是否用over,...
一般需要事先写好css样式等function tab(sId) { var tabs = document.getElementsByTagName("H2"); var boxs = document.getElementsByTagName("h3"); if ( boxs[sId].style.display=="block"){ boxs[sId].style.display="none"; tabs[sId].style.backgroundColor="#E3F4FE"; tabs[sId].style.color="#000000"; } else{ boxs[sId].style.display="block"; tabs[sId].style.backgroundColor="#3575CC"; tabs[sId].style.color="#fff...
脚本之家_新闻显示选项卡效果(javascript+css) 新闻排行 国内 国际 社会 网评 新疆阜康铁路桥梁坍塌多节运煤车厢侧翻坠河最高法:承诺不判赖昌星死刑没有超越法律程序物权法:满70年住宅建设用地使用权将自动续期弟弟被妻下药毒死男子买女尸为其配阴婚(图)揭开郑州神枪手神秘面纱 头号狙击手是近视眼美军高官:不排除和中国发生直接军事对抗可能浙江东阳传奇富姐吴英涉嫌非法吸收存款被批捕西方炒作"中国航母威胁论"称05年已正式服...
javascripttest function setDay() { var themonth=document.getElementById("month"); var themaxmonthday=31; if(themonth.value=="2") { themaxmonthday=28; } var theday=document.getElementById("day"); var tempdaylength=theday.options.length; for(var j=tempdaylength;j>0;j--) { theday.options.remove(j); } for(var i=1;i 1月 2月 3月 4月 5月 6月 12月 [Ctrl+A 全选 注:如需引入外部Js需刷新才...
虽然方便好用,但是个人觉得其在UI方面的表现不是太出彩,今天无意中看到jquery tools--一种基于jquery的UI表现框架,其UI功能展示风格类似(或模仿)flex。该框架提供了tabs(选项卡/页签)overlay(覆盖层),tooltip(提示框),scrollable(滚动信息栏),expose(突出显示),flahembed(视频播放嵌入)六大类功能(其官方网站自称为六大工具),这六大类功能又是每个功能都有自己的独立支持包,不相互干扰,用户完全可以跟据自己需要...
我们将学习如何使用Fx.Morph(它从本质上可以让你同时渐变多个样式表属性),然后我们再检查一下应用到Fx.Tween和Fx.Morph的一些Fx选项,最后我们将看看如何使用Fx事件,譬如“onComplete”和“onStart”。通过这些选项和事件,我们可以获得更好的控制权来控制形变动画。 Fx.Morph 创建一个新的Fx.Morph 初始化一个新的形变和创建一个新的渐变很类似,除了你要指定多个样式属性以外。 参考代码: 代码如下: // 首先,把我们的元素...
简单的“额外信息”标签(TAB) 鼠标移上去显示内容的TAB 在这第一个项目中,我们要创建一个简单的菜单,当鼠标移动到这些菜单上时显示相应的内容。首先,我们来完成HTML代码——我们就用包含四个列表项的ul好了,然后再创建四个div(每一个div对应一个列表项): 参考代码: 代码如下: // 这里是我们的菜单 One Two Three Four // 这里是我们的内容div content for one content for two content for three content for four 现...
这里要注意,用于产生changeTabInterval的随机数,防止页面上TabPane过多,如果设置的changeTabInterval都一样的话会产生整齐划一的切换的效果,不美观. 自动切换Tab选项卡 function randint(m,n)//产生m-n之间的随机整数 { return Math.random()*(n-m)+m; } function IfNull(a,dv) { return typeof(a) =="undefined"?dv:a; } var TabPaneConfig = { idPrefix: "tab-panel-object-", idCounter: 0, getId: function(){ ret...
HTML:多个导航tag加一个放置默认内容div 脚本:以数组的形式给出每个导航对应的html 多层叠TAB选项卡 .nonstop { width:168px; font-size:12px;margin:auto; border:1px solid #cdcdcd; padding:2px; overflow:hidden; } .nonstop span { float:left;_display:inline; cursor:pointer; width:22px; height:14px; background:#cdcdcd url(./img/button.gif) no-repeat -175px top; font-size:10px; line-height:14px; margin:2px ...
获取Select : 获取select 选中的 text : $("#ddlRegType").find("option:selected").text(); 获取select选中的 value: $("#ddlRegType ").val(); 获取select选中的索引: $("#ddlRegType ").get(0).selectedIndex; 设置select: 设置select 选中的索引: $("#ddlRegType ").get(0).selectedIndex=index;//index为索引值 设置select 选中的value: $("#ddlRegType ").attr("value","Normal“); $("#ddlRegType ").val("Normal"); $("...
在实际应用过程中,只要保证选项卡模块结构代码的完整性,就可以任意添加N个同类选项卡,不需要手动在HTML里绑定事件处理程序以及给要隐藏显示的内容层添加ID。 Javascript(jquery)代码如下: 代码如下: $(document).ready(function(){ $("ul.menu li:first-child").addClass("current"); $("div.content").find("div.layout:not(:first-child)").hide(); $("div.content div.layout").attr("id", function(){return idNumber(...
介绍的是基于JQuery实现的一个选项卡效果,重点体现在HTML里没有内联事件处理程序,而是定义在js文件里,做到行为与结构的分离。在实际应用过程中,只 要保证选项卡模块结构代码的完整性,就可以任意添加N个同类选项卡,不需要手动在HTML里绑定事件处理程序以及给要隐藏显示的内容层添加ID。 在这里,我又做了部分的修改,增加了选项卡可自动切换功能,以及选项卡点击相应还是鼠标放上后相应的参数,同时依然支持多次调用。 现在,...
核心代码: 代码如下:function cur(ele){ $(ele).addClass("cur").siblings().removeClass("cur"); } function tab(id_tab,tag_tab,id_con,tag_con,act){ $(id_tab).find(tag_tab).eq(0).addClass("cur"); $(id_con).find(tag_con).eq(0).show().siblings(tag_con).hide(); if(!act){ act="click"}; if(act=="click"){ $(id_tab).find(tag_tab).each(function(i){ $(id_tab).find(tag_tab).eq(i).click(function(){ cur(this); $(i...
* { padding-bottom: 0px; margin: 0px; padding-left: 0px; padding-right: 0px; font-size: 12px; padding-top: 0px; } BODY { padding-left: 20px; padding-top: 20px; } .wid240 { width: 242px; margin-bottom: 20px; } .wid180 { width: 182px; } .tab { border-bottom: #000 1px solid; border-left: #000 1px solid; border-top: #000 1px solid; border-right: #000 1px solid; } .tab UL ...
第一步:引用table.js 代码如下: 第二步:定义选中的样式,比如“active”,应用选项卡的块的ID,比如“sidebar”,默认被选中的序号,比如第一个“0”; 第三步:调用函数: 代码如下: //参数分别为:默认选择项 应用块的id 选中的样式 table(0, "sidebar", "active") 一切OK,选项卡响应click事件,兼任IE和FF,等有时间了再优化,效果如下: HTML源代码如下: 代码如下: New Web Project .sidebar { width: 140px...