js(JavaScript)实现拉环标签切换效果的简单实例

一个可以js(JavaScript)的标签标签切换代码，可以自动适应宽度，可以自己添加删除标签块，傻瓜式操作便能完成！

复制代码代码如下：DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Transitional//EN ' ' http://www .W3C。org/TR/1999/REC-HTML 401-19991224/挂失。DTD ' HTML xmlns=' http://www .w3。org/1999/XHTML ' hearta name=' keywords ' content=' JS '代码，TAB标签，JS广告代码，JS特效代码，阅微草堂/title自适应宽度的标签导航/title MetA http-equiv=Content-Type Content=' text/html；charset=GB 2312 ' STYLe type=text/CSSbody { FONT-SiZe : 14px；' FONT-FAMILY: '宋体} OL LI { margin : 8px } # con { FONT-SiZe : 12px；余量： 0px自动；宽度： 600像素} #标记{ PADDING-right : 0 px；PADDING-左侧： 0pxPADDING-bottom : 0px；MARGIN: 0px 0px 0px 10px宽度： 400像素；PADDING-TOP : 0px；HEIGHT: 23px } #标签LI {背景： URL(图片/标签左。gif)无重复左下方；左侧浮动：MARGIN-right : 1px；列表样式-类型TYPE:noneHEIGHT: 23px } #标签阿利{ PADDING-right : 10px；PADDING-left : 10px；背景：网址(images/tagright.gif)右下方无重复；左侧浮动：PADDING-bottom : 0px；颜色： # 999线-高度： 23像素；PADDING-TOP : 0px；HEIGHT : 23 XText-装饰： none } #标签李。空标签{背景：无}透明滚动重复0% 0%;宽度： 4px } #标签李。选择标签{背景-位置：左上角；保证金-底部：-2px；相对位置：标记李。选择标记A {背景-位置：右上角；颜色： # 000线-高度： 25px高度： 25px } #标记内容{ PADDING-right : 1 px；BORDER: #aecbd4 1px固体；PADDING-left : 1 px；PADDING-bottom : 1 px；PADDING-top :1 px；背景-COLOR: #fff} .标记内容{ PADDING-right : 10px；显示器：无；PADDING-left : 10px；背景： URL(图片/BG。gif)重复-x；PADDING-bottom : 10px；宽度： 576像素；颜色： # 474747填充-顶部： 10px高度： 250 px } #标签内容div。select tag { display : block }/style meta content=' MSHTML 6。00 .2800 .1589 ' name=GENERATOR/headlyddiv id=conUL id=tags LI class=selectTagA onMouseover=' selectTag(' tag content 0 '，this)' href=' JavaScript : void(0 ')标签一/A/LI鼠标悬停时的LIA=' SelectTag(' tag content 1 '，this)' href=' JavaScript : void(0 ')标签二/A/LI鼠标悬停时的LIA=' SelectTag(' tag content 2 '，this)' href=' JavaScript : void(0 ')自适应宽度的标签/A/LI鼠标悬停时的LIA=' SelectTag(' tag content 3 '，this)' href=' JavaScript : void(0 ')自适应宽度/A /LI/ULDIV id=tagContentDIV类=tagContent id=tagContent0第一个标签的内容/DIVIDIV类=' TagContent SelectTag ' id=TagContent 1第二个标签的内容/DIVIDIV类=标记内容id=标记内容2第三个标签的内容/DIVIDIV类=标记内容id=标记内容3第四个标签的内容/DIV/DIV/DIV脚本类型=text/JavaScript函数selectTag(显示内容，selfObj){//操作标签var标记=文档。getelementbyid('标记').getElementsByTagName(' Li ')；var taglength=tag . length for(I=0；itaglengthi ){ tag[i].className=} SelfObj。ParentNode。类名=' SelectTag//操作内容for(I=0；j=文档。getelementbyid(' tagContent ' I)；I){ j . style。显示='无'；}文档。getelementbyid(显示内容。风格。display=' block}/SCRIPT/BODY/HTML