`

模拟 select下拉框

阅读更多
<script type="text/javascript">
iws=false;
function shlist(){
document.getElementById("t_select-list").style.display=document.getElementById("t_select-list").style.display=="block"?"none":"block";
}
function changesever(ts){
document.getElementById("t_selected").innerHTML="---"+ts.innerHTML+"---";
shlist();
//alert(document.getElementById("selected").rel);
}
function cws(val){
iws=val;
}
function hlist(){
if(!iws)document.getElementById("t_select-list").style.display="none";
}
</script>

<style type="text/css">
#t_select{ width:200px; height:18px; }
#t_selected{width:200px; height:18px; line-height:18px; color:#F2E3A8; background:url(http://images2.wowchina.com/images_wow/front/select_top.gif) no-repeat; font-size:12px; text-align:center; position:relative; z-index:998; cursor:default;}
#t_select-list{position:absolute;margin-top:1px; margin-left:3px;filter:alpha(opacity=90); opacity:0.9; background:#54482B; border:#918C6D 1px solid; font-size:12px; width:192px;text-align:center; display:none;}
#t_select-list a{display:block; color:#F2E3A8; text-decoration:none;}
#t_select-list a:hover{text-decoration:underline; background:#6F6546;}
</style>

<div id="t_select">
           <div id="t_selected" onclick="shlist();" onmouseover="cws(true);" onmouseout="cws(false);" onblur="hlist()">---请选择您要下载的程序---</div>
                                   <div id="t_select-list" onmouseover="cws(true);" onmouseout="cws(false);">
          <a href="http://www.wowchina.com/download/client/index.shtml#0" onclick="changesever(this);" target="_blank">我没有客户端</a>
          <a href="http://www.wowchina.com/download/client/index.shtml#1123" onclick="changesever(this);" target="_blank">我的客户端低于2.1.0版本</a>
          <a href="http://www.wowchina.com/download/client/index.shtml?2030" onclick="changesever(this);" target="_blank">2.2.3到2.3.0升级补丁</a>
                                    <a href="http://www.wowchina.com/download/client/index.shtml?2032" onclick="changesever(this);" target="_blank">2.3.0到2.3.2升级补丁</a>
                                    <a href="http://www.wowchina.com/download/client/index.shtml?2033" onclick="changesever(this);" target="_blank">2.3.2到2.3.3升级补丁</a>
                                    <a href="http://www.wowchina.com/download/client/index.shtml?2040" onclick="changesever(this);" target="_blank">2.3.3到2.4.0升级补丁</a>
                                    <a href="http://www.wowchina.com/download/client/index.shtml?2041" onclick="changesever(this);" target="_blank">2.4.0到2.4.1升级补丁</a>
                                    <a href="http://www.wowchina.com/download/client/index.shtml?2042" onclick="changesever(this);" target="_blank">2.4.1到2.4.2升级补丁</a>
                                    <a href="http://www.wowchina.com/download/client/index.shtml?2043" onclick="changesever(this);" target="_blank">2.4.2到2.4.3升级补丁</a>
           </div>
          </div>
          <div>ffffffff</div>

 

分享到:
评论

相关推荐

    DIV模拟select下拉框

    "DIV模拟select下拉框"就是一种利用JavaScript库,如jQuery,来实现这一目标的技术。它通过用CSS样式化的DIV元素替换原生的SELECT元素,从而提供更灵活的外观和交互体验。 标题中的"DIV模拟select下拉框"意味着我们...

    原生js text文本框模拟select下拉框美化点击下拉菜单选

    原生js text文本框模拟select下拉框美化点击下拉菜单选 原生js text文本框模拟select下拉框美化点击下拉菜单选 原生js text文本框模拟select下拉框美化点击下拉菜单选 原生js text文本框模拟select下拉框美化点击...

    JS模拟select 下拉框组件

    **JS模拟Select下拉框组件详解** 在网页开发中,Select元素是常用的数据选择控件,但其样式和交互方式往往不能满足设计师和开发者对于用户体验的高要求。为了解决这个问题,开发人员通常会使用JavaScript来模拟...

    jQuery模拟select下拉框插件.zip

    "jQuery模拟select下拉框插件"就是这样一个工具,它提供了更丰富的交互性和定制性,相比原生的HTML下拉框控件,能够为用户带来更好的体验。下面将详细探讨这个插件的原理、功能以及如何使用。 首先,原生的`&lt;select...

    jQuery模拟select下拉框三级城市联动代码.zip

    本项目“jQuery模拟select下拉框三级城市联动代码”旨在利用jQuery实现一个功能丰富的城市选择器,该选择器能够模拟传统的HTML select元素,并且支持三级联动效果,即省份、城市和区县之间相互关联,选择其中一个...

    jQuery模拟select下拉框多选和单选插件.zip

    本资源“jQuery模拟select下拉框多选和单选插件.zip”提供了一种利用jQuery实现模拟下拉框选择功能的方法,特别适合在网页中创建具有多选和单选功能的下拉菜单,而无需使用原生的`&lt;select&gt;`元素。这样的插件对于提升...

    jQuery模拟select下拉框多选和单选插件

    本话题聚焦于一个基于jQuery的特定插件,用于模拟select下拉框的多选和单选功能,并且具有美观的界面设计。 这个插件主要针对传统的HTML `&lt;select&gt;` 元素进行增强,提供了更加友好的用户体验和视觉效果。在网页开发...

    jQuery模拟select下拉框插件

    jQuery模拟select下拉框插件就是为了克服这些局限性。它通常会用一个`&lt;div&gt;`或其他HTML元素来模拟下拉框,并结合JavaScript和CSS实现动态效果和定制样式。这种插件可以提供更多的定制选项,如分组、搜索、过滤、无限...

    原生js text文本框模拟select下拉框美化点击下拉菜单选择value赋值效果源码.zip

    这个“原生js text文本框模拟select下拉框美化点击下拉菜单选择value赋值效果源码”就是为了解决这个问题而提供的。下面我们将详细探讨相关的JavaScript知识以及如何实现这样的功能。 1. **原生JavaScript**:此...

    类似百度下拉提示 模拟select下拉框 jquery插件

    这种技术主要应用于表单元素,尤其是模拟传统的`&lt;select&gt;`下拉框,但提供了更为丰富的交互性和自定义性。 首先,jQuery是一个流行的JavaScript库,它简化了DOM操作、事件处理、动画和Ajax交互等任务。在这个插件中...

    模拟select下拉框

    DIV模拟select框,自动生成div框

    模拟select下拉框插件SelectBox

    【标题】"模拟select下拉框插件SelectBox"是一个专为网页设计开发的JavaScript插件,主要用于替换原生HTML的`&lt;select&gt;`元素,提供更丰富的交互效果和自定义功能。这种插件通常用于提升用户体验,使得下拉选择框在...

    jquery模拟SELECT下拉框取值效果

    ### Jquery模拟SELECT下拉框取值效果知识点 在Web开发中,下拉选择框(SELECT元素)是一种常见的用户交互控件,它允许用户从一系列预设选项中选择一个或多个选项。然而,原生的SELECT元素在外观和用户体验上可能受...

    jQuery模拟select下拉框插件特效代码

    本篇文章将详细探讨“jQuery模拟select下拉框插件特效代码”的相关知识点。 一、jQuery模拟Select下拉框的原因 在HTML中,`&lt;select&gt;`元素用于创建下拉菜单,但其样式有限且不易自定义。而使用jQuery模拟下拉框,...

    divcss模拟select

    divcss模拟select 下拉框 select 改变样式

    jQuery模拟select下拉框三级城市联动特效代码

    本示例中的“jQuery模拟select下拉框三级城市联动特效代码”就是一种实现方式,它允许用户通过选择省份和城市,自动加载并显示对应的区县,形成一个便捷的三级联动选择器。下面我们将详细探讨这个主题。 首先,`...

Global site tag (gtag.js) - Google Analytics