e股脑电脑教程网
  • 首 页
  • 操作系统
  • 应用软件
  • 下载工具
  • 影音视频
  • 办公软件
  • 媒体制作
  • 网站建设
  • 平面设计
  • 数据库
  • 程序开发
  • 视频教程
编辑推荐: | 文章搜索:
您现在的位置: e股脑 >> 网站建设 >> Javascript教程 >> 自制漂亮的select >> 教程正文
 
教程搜索
 
 
相关教程
  • javascript窗口功能指南之关闭窗口
  • javascript窗口功能指南之创建对话
  • javascript窗口功能指南之引用已打
  • javascript窗口功能指南之在窗口中
  • javascript窗口功能指南之操纵窗口
  • javascript窗口功能指南之检查一个
  • javascript窗口功能指南之定制新窗
  • javascript窗口功能指南之发挥窗口
  • javascript窗口功能指南之打开一个
  • 输入日期之改进模式
  • 用javascript实现利用FLASH嵌入声
  • 如何使用可以接受输入的列表框
  • 图片控制的渐变色文字
  • javascript实例教程(10) 随机显示
  • javascript实例教程(2) 创建弹出式
  • javascript 小技巧(第十集)
 
 

图文教程


  • Windows抢了谁的饭碗 非主流操作系统To

  • 地球还是火星 平常心看“非主流”

  • 综合运用Office 2007批量制作奖状

  • 没有系统盘如何才能修复受损系统?

  • 巧妙运用Excel中边界的附加功能!
 
 
赞 助 商
 
 
自制漂亮的select
  • 来源:e股脑
  • 点击次数:
  • 更新时间:2007-8-9

效果如图:

代码如下:

<HTML>

<HEAD><title>漂亮的下拉框</title>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<SCRIPT>

// ViaSelect Environment Constants

var SS_ENV = new Object();

SS_ENV.IE_Version = new Number(((window.navigator.appVersion.split('; '))[1].split(' '))[1]);

SS_ENV.CR = new Object();

SS_ENV.CR.ReverseBackground = '#E2519C';

SS_ENV.CR.ReverseText = 'white';

SS_ENV.CR.Border = '#D55C9A';

SS_ENV.CR.BorderActive = '#FF6CB7';

SS_ENV.DefaultHeight = 20;

SS_ENV.ButtonWidth = 13;

SS_ENV.OptionsDivStyle = ''

+ ' display:none;'

+ ' z-index:10;'

+ ' position:absolute;'

+ ' border:1 solid '+ SS_ENV.CR.Border+';'

+ ' background-color:white;'

+ ' scrollbar-face-color:#D4D0C8;'

+ ' scrollbar-shadow-color:white;'

+ ' scrollbar-highlight-color:#F6F5F4;'

+ ' scrollbar-3dlight-color:white'

+ ' scrollbar-darkshadow-color:#86837E;'

+ ' scrollbar-track-color:#F6F5F4;'

+ ' scrollbar-arrow-color:#86837E;';

SS_ENV.OptionNobrStyle = ''

+ ' font-size:12px;'

+ ' font-family:奔覆;';

// SaySelect Variables

var SS_VAR = new Object();

SS_VAR.DivDummy = document.createElement("DIV");

SS_VAR.SelectList = new Array();

SS_VAR.bEventAttached = false;

var SS_CreatedElements = new Object();


img_s_src="btn_down_s.gif";

img_src="btn_down.gif";

img_blank_src="http://www.chinaitpower.com/A/2004-03-14/img_blank.gif;

function unloadObjects()

{

try {

if (SS_VAR && SS_VAR.SelectList)

{

for (key in SS_VAR.SelectList)

{

if (SS_VAR.SelectList[key])

{

try {

SS_VAR.SelectList[key].select.setAttribute('SS', 0);

} catch (e) {};

delete SS_VAR.SelectList[key];

}

}

}

} catch (e) {};

}

attachEvent("onunload", unloadObjects);

function SS_create (srcHTML, ListMax, bAutoDetect)

{

// property

this.ssID = SS_VAR.SelectList.length;

this.bOriginalSelect = (bAutoDetect && SS_ENV.IE_Version < 5.5);

this.select = SS_createElement(srcHTML);

this.selectedIndex = this.select.selectedIndex;

this.options = this.select.options;

this.width = parseInt(this.select.style.width);

this.height = (this.select.style.height) ? parseInt(this.select.style.height) : SS_ENV.DefaultHeight;

this.OptionHeight = this.height - 4;

this.bListDown = (ListMax && '-'==ListMax.toString().substr(0, 1)) ? false : true;

this.ListMax = (!isNaN(parseInt(ListMax))) ? Math.abs(ListMax) : 100;

this.Table;

this.TitleDiv;

this.TitleTable;

this.TitleWrapper;

this.OptionsDiv;

this.OptionsWrapper;


this.OptionsTable;

this.bFocused = false;

this.bExpanded = false;

this.bReverse = false;

// private method

this.isThisEventToBeCanceled = SS_isThisEventToBeCanceled;

this.toggleTitle = SS_toggleTitle;

this.syncSelectedIndex = SS_syncSelectedIndex;

this.toggleOptions = SS_toggleOptions;

this.turnOnOption = SS_turnOnOption;

this.turnOffOption = SS_turnOffOption;

this.handleMousewheel = SS_handleMousewheel;

this.handleOverTitle = SS_handleOverTitle;

this.handleOutTitle = SS_handleOutTitle;

this.handleOverOption = SS_handleOverOption;

this.createTable = SS_createTable;

this.createTitleDiv = SS_createTitleDiv;

this.createOptionsDiv = SS_createOptionsDiv;

this.createOptionTr = SS_createOptionTr;

this.adjustOptionsDiv = SS_adjustOptionsDiv;

this.syncOptions = SS_syncOptions;

this.pressOption = SS_pressOption;

this.moveOption = SS_moveOption;

this.releaseOption = SS_releaseOption;

this.pressTitle = SS_pressTitle;

this.releaseTitle = SS_releaseTitle;

// public method

this.display = SS_display;

this.insertOption = SS_insertOption;

this.deleteOption = SS_deleteOption;

this.changeOption = SS_changeOption;

// initiate

this.createTable()

1 2 3 4 5 6 下一页
  • 上一篇教程: 我也写了个日历控件
  • 下一篇教程: 默认选中第二个按钮(取消)的conform
  •  

    关于本站 | 广告联系 | 版权声明 | 使用帮助

    Copyright © 2004-2008 www.egunao.com All rights reserved.