`
ghost_fly
  • 浏览: 111483 次
  • 性别: Icon_minigender_1
  • 来自: 长沙
社区版块
存档分类
最新评论

javascript键盘事件表单交互

阅读更多
键盘选择表单
  <style type="text/css"> 
  *{ 
  margin:0px;padding:0px;font-size:12px; 
  } 
  input{ 
      width:100px;height:20px;border:1px solid #ccc; 
    } 
TD { cursor: hand; }    
  </style> 
  <script language="javascript" type="text/javascript">    
    function document.onkeydown(){   
     if(document.all('oTable')){ 
         var rowsArray = document.all('oTable').rows;   
         for(var i=0;i<rowsArray.length;i++){   
              if(rowsArray[i].children[0].style.backgroundColor=='#dcdcdc'){   
                 switch(window.event.keyCode){   
                     case 38 :   
                         if(i-1>=0){   
                           rowsArray[i-1].children[0].style.backgroundColor = '#dcdcdc';    
                           rowsArray[i].children[0].style.backgroundColor = '';   
                         }   
                         break;   
                     case 40 :   
                         if(i+1<=rowsArray.length-1){   
                            rowsArray[i+1].children[0].style.backgroundColor = '#dcdcdc';     
                            rowsArray[i].children[0].style.backgroundColor = '';   
                         }   
                         break;                            
                     case 13 :   
                 var str = rowsArray[i].childNodes[0].innerHTML; 
               document.getElementById("username").value = str; 
               document.getElementById("tips").style.display='none';             
                        break;    
                 break;   
              }   
         }   
         } 
      }   
      function document.onclick(){   
       if(document.all('oTable')){ 
          if(window.event.srcElement.tagName!='TD'){ return; }   
          var rowsArray = document.all('oTable').rows;   
          for(var i=0;i<rowsArray.length;i++){   
               if(rowsArray[i].cells[0]==window.event.srcElement){   
                  rowsArray[i].cells[0].style.backgroundColor = '#dcdcdc';   
               }else{   
                  rowsArray[i].cells[0].style.backgroundColor = '';   
               }   
          }    
        }          
      }   


  function doaaa(id) 
  { 

  var str = id.childNodes[0].innerHTML; 
  alert(str); 
    document.getElementById("username").value = str; 
    document.getElementById("tips").style.display='none'; 
  return true; 
  } 
var aid = new Array("人民币","美刀","英镑","欧元","港币"); 
function tips(id,str){ 
var l=document.getElementById(id).offsetLeft+120; 
var t=document.getElementById(id).offsetTop; 
var htmlstring ="<table id=\"oTable\" width=\"100\">"; 
for(var i=0;i<aid.length;i++){ 
if(i==0){htmlstring = htmlstring+"<tr height=\"20\" onclick=\"doaaa(this);\"><td style=\"background-color:#dcdcdc;\">0"+i+":"+aid[i]+"</td></tr>";} 
else{htmlstring = htmlstring+"<tr height=\"20\" onclick=\"doaaa(this);\"><td>0"+i+":"+aid[i]+"</td></tr>";} 

} 
htmlstring = htmlstring+"</table>"; 
var inheight = aid.length*22+"px"; 
document.getElementById("tips").innerHTML=htmlstring; 
document.getElementById("tips").style.left=l+"px"; 
document.getElementById("tips").style.top=t+"px"; 
document.getElementById("tips").style.height=inheight; 
document.getElementById("tips").style.display="block"; 
} 
function outtips(){ 
for(var i=0;i<aid.length;i++){ 
 if(document.getElementById("username").value=="0"+i)  
  document.getElementById("username").value=aid[i]; 
} 
    //if(document.getElementById("username").value==0+"")  
  //  document.getElementById("tips").style.display='none'; 
} 
</script> 
</head> 
<body> 

                     
<div id="tips" style="position:absolute;border:1px solid #ccc;padding:0px 3px;color:#f00;display:none;height:200px;line-height:20px;background:#fcfcfc"></div> 
<br /> 
姓名:<input type="text" id="username" onfocus="tips('username','姓名长度最多16个字符')" onblur="outtips()" /> 
<br /> 
密码:<input type="password" id="password" onfocus="tips('password','密码长度必须在3-18位之间')" onblur="outtips()" /> 

 

 

Msdn Menu

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<html> 
<head> 
<title>MSND menu</title> 
<meta name="Generator" content="EditPlus"> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<meta name="Author" content=""> 
<meta name="Keywords" content=""> 
<meta name="Description" content=""> 
<style> 
.LocaleManagementFlyoutPopup { 
 font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif; 
  border:1px solid #666666; 
  padding: 3px 3px 3px 3px; 
  text-align: left; 
  background-color: #FFFFFF; 
  z-index: 10; 
  opacity: .95; 
  filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=2,OffY=2,Color='silver',Positive='true') alpha(opacity=95); 
} 

.LocaleManagementFlyoutPopup A, .LocaleManagementFlyoutPopup A:visited { 
  font-size: 10px; 
  color: #000000; 
  cursor: hand; 
  border: 1px solid #FFFFFF; 
  padding: 1px 3px 1px 3px; 
  height: 15px; 
  text-align: left; 
  text-decoration: none; 
  white-space: nowrap; 
  display: block; 
} 

.LocaleManagementFlyoutPopup A:hover { 
  background-color: #f0f7fd; 
  color: #000000; 
  cursor: hand; 
  border: 1px solid #addbef; 
  padding: 1px 3px 1px 3px; 
  height: 15px; 
  text-decoration: none; 
  white-space: nowrap; 
  display: block; 
} 

.LocaleManagementFlyoutPopupHr { 
 height: 1px; 
 background: #d0e0f0; 
 margin: 0px 11px 21px 11px; 
} 

.LocaleManagementFlyoutPopArrow { 
  margin: 4px 0px 0px 0px; 
} 

.LocaleManagementFlyoutStatic_msdn { 
 border: 1px solid #ffffff; 
} 

.LocaleManagementFlyoutStaticHover_msdn { 
 border: 1px solid #addbef; 
} 

.TFlyPopupAnimate { 
 position: absolute; 
 display: block; 
 border: 1px solid gray; 
 overflow: hidden; 
 visibility: hidden; 
 margin: 0; 
 padding: 0; 
 z-index: 1; 
} 
</style> 
<script> 
/* 
name 对象的 id 值 
offsetLeft 定位:左 - 偏移量 
offsetTop 定位:顶部 - 偏移量 
alignment 对齐方式{-1: left; 0: center; 1: right} 
anyIter 显示方式(<=0: 普通样式; >0: 缩放样式) 
anyTime 动画时间间隔 
staticHover 鼠标覆盖时的样式 
popupHover 显示内容鼠标覆盖时的样式 
popupLatency 显示内容延时 
hideLatency 隐藏内容延时 
onInit 初始化 
onPopup 显示内容时行为 
onHide 隐藏内容时行为 
*/ 
function TFly_Init(name, offsetLeft, offsetTop, alignment, anyIter, anyTime, staticHover, popupHover, popupLatency, hideLatency, onInit, onPopup, onHide) { 
 var TFly = document.getElementById(name); 
 TFly.DT = document.getElementById(name + "_Popup"); // 显示内容对象 
 TFly.F = document.getElementById(name + "_Anim"); // 动画效果对象 
 TFly.oX = offsetLeft; 
 TFly.oY = offsetTop; 
 TFly.alignment = alignment; 
 TFly.AnyIter = anyIter; 
 TFly.AnyTime = anyTime; 

 TFly.popupLatency = popupLatency; 
 TFly.hideLatency = hideLatency; 
 TFly.onPopup = onPopup; 
 TFly.onHide = onHide; 

 TFly.onmouseover = function() { 
 if (staticHover != '') { // 替换样式,并储存原来的样式 
     TFly.className_ = TFly.className; 
      TFly.className = staticHover; 
    } 
 TFly_Popup(TFly, true); 
  } 

 TFly.onmouseout = function() { 
   if (staticHover != '') { // 恢复原来的样式 
     TFly.className = TFly.className_; 
    } 
    TFly_Popup(TFly, false); 
  } 

 if (document.all) { 
 TFly.onactivate = TFly.onmouseover; 
 TFly.ondeactivate = TFly.onmouseout; 
 } else { 
 TFly.onfocus = TFly.onmouseover; 
 TFly.onblur = TFly.onmouseout; 
 } 

 TFly.DT.onmouseover = function() { 
 if (popupHover != '') { 
     TFly.DT.className_ = TFly.DT.className; 
      TFly.DT.className = popupHover; 
    } 
    TFly_Popup(TFly, true); 
  } 

 TFly.DT.onmouseout = function() { 
   if (popupHover != '') { 
 TFly.DT.className = TFly.DT.className_; 
    } 
   TFly_Popup(TFly, false); 
 } 

 TFly_CallClientFunction(onInit, TFly); 
} 

// 调用初始化程序 
function TFly_CallClientFunction(name, TFly) { 
 if (name != null && name != "") 
 eval(name + "(TFly);"); 
} 

// 定位 
function TFly_SetPosition(TFly, obj) { 
 obj.style.top = TFly.oY + TFly.offsetHeight + "px"; 
 obj.style.left = TFly.oX + (TFly.offsetWidth - obj.offsetWidth ) * (1 + TFly.alignment) / 2 + "px"; 
} 

function TFly_Popup(TFly, value) { 
 if (TFly.timer != null) window.clearTimeout(TFly.timer); // 清除超时 

 if (value) { // 判断状态 
 if (TFly.status == "on") return; 

 // 如果 popup 已经显示,则显示延时为 0 
    // 例如从一个菜单移动到另外一个菜单 
    var timeout = (TFly.status == "active") ? 0 : TFly.popupLatency; 

 if (TFly.AnyIter > 0 && TFly.AnyTime > 0) 
 TFly.timer = window.setTimeout(function() {TFly_AnimateStart(TFly, true, TFly.F.curIter);}, timeout); 
 else 
 TFly.timer = window.setTimeout(function() {TFly_SetVisibility(TFly, true);}, timeout); 

 } else { 
 if (TFly.status == "off") return; 

 var timeout = (TFly.status == "active") ? 0 : TFly.hideLatency; 

 if (TFly.AnyIter > 0 && TFly.AnyTime > 0) 
 TFly.timer = window.setTimeout(function() {TFly_AnimateStart(TFly, false, TFly.F.curIter);}, timeout); 
 else 
 TFly.timer = window.setTimeout(function() {TFly_SetVisibility(TFly, false);}, timeout); 
 } 
} 

// 设置弹出内容的可见性 
function TFly_SetVisibility(TFly, value) { 
 if (value == true) { 
 TFly_SetPosition(TFly, TFly.DT); 
 TFly.DT.style.visibility = "visible"; 
 TFly.style.zIndex = "999"; 
 } else { 
 TFly.DT.style.visibility = "hidden"; 
 TFly.style.zIndex = "0"; 
 TFly.DT.style.left = "-10000px"; 
 } 
} 

function TFly_AnimateStart (TFly, inout, curIter) { 
 if (TFly.F.timer != null) window.clearTimeout(TFly.F.timer); 

 if (curIter == null) curIter=0; 

 if (TFly.status != "active") { 
 TFly.status = "active"; 
 TFly.F.style.visibility = "visible"; 
 TFly.DT.style.visibility = "hidden"; 
 } 

 if (curIter < 0 || curIter > TFly.AnyIter) { 
 TFly.F.curIter = (curIter < 1) ? 0 : TFly.AnyIter; 
 TFly.status = (TFly.F.curIter == TFly.AnyIter) ? "on": "off"; 
 TFly.F.style.visibility = "hidden"; 
 TFly_SetPosition(TFly, TFly.DT); 
 TFly.style.zIndex = (TFly.F.curIter == TFly.AnyIter) ? "999" : "0"; 

 if (TFly.F.curIter == TFly.AnyIter) { 
 TFly.status = "on"; 
 TFly_SetVisibility(TFly, true); 
 TFly_CallClientFunction(TFly.onPopup, TFly); 
 } else { 
 TFly.status = "off"; 
 TFly_SetVisibility(TFly, false); 
 TFly_CallClientFunction(TFly.onHide, TFly); 
 } 
 } else { 
 var per = curIter * (95 / TFly.AnyIter) + 5; 
 TFly.F.style.visibility = "hidden"; 
 TFly.F.style.width = TFly.DT.offsetWidth / 100 * per + "px"; 
 TFly.F.style.height = TFly.DT.offsetHeight / 100 * per + "px"; 
 TFly_SetPosition(TFly, TFly.F); 
 TFly.F.style.visibility = "visible"; 
 var timeout = (per == 100 ) ? 0 : TFly.AnyTime - (TFly.AnyTime / (TFly.AnyIter) * (curIter)); 
 curIter += (inout) ? 1 : -1; 
 TFly.F.timer = window.setTimeout(function() {TFly_AnimateStart(TFly, inout, curIter)}, timeout); 
 TFly.F.curIter = curIter; 
 } 
} 
</script> 
</head> 

<body> 
           

<div style="display:inline;vertical-align:middle"> 
  <div class="LocaleManagementFlyoutStatic_msdn" style="position:relative;" id="LocaleManagement"> 
    <a class="LocaleManagementFlyoutStaticLink_msdn" href="javascript:void(0)">United States - English </a><img class="LocaleManagementFlyoutPopArrow" src="http://msdn2.microsoft.com/msdn/Controls/UserRecognitionFlyout/en-us/popdownarrow-msdn-left.gif" alt="Dropdown Arrow" style="height:4px;width:7px;border-width:0px;" /><div id="LocaleManagement_Popup" class="LocaleManagementFlyoutPopup" style="position: absolute;visibility:hidden;left:-65534px;"> 
      <table border="0" style="width:175px;"> 
        <tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl05','')">Australia (English)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl06','')">Brasil (Portugués)</a></td> 

        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl07','')">Canada (English)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl08','')">Canada (Fran?ais)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl09','')">中国 (简体中文)</a></td> 
        </tr><tr> 

          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl10','')">Deutschland (Deutsch)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl11','')">France (Fran?ais)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl12','')">India (English)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl13','')">Россия (Pусский)</a></td> 

        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl14','')">United Kingdom (English)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl15','')">United States (English)</a></td> 
        </tr><tr> 
          <td class="LocaleManagementFlyoutPopupHr"></td> 
        </tr><tr> 
       
            <td><a href="#" target=_blank>更多</a></td> 
        </tr> 
      </table></div> 
      <div id="LocaleManagement_Anim" class="TFlyPopupAnimate"></div> 
  </div> 
   
</div> 

<script> 
TFly_Init('LocaleManagement', 0, 0, -1, 2, 60, 'LocaleManagementFlyoutStaticHover_msdn', '', 100, 400, '', '', ''); 
</script> 
</body> 
</html>

 

 

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<html> 
<head> 
<title>MSND menu</title> 
<meta name="Generator" content="EditPlus"> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<meta name="Author" content=""> 
<meta name="Keywords" content=""> 
<meta name="Description" content=""> 
<style> 
.LocaleManagementFlyoutPopup { 
 font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif; 
  border:1px solid #666666; 
  padding: 3px 3px 3px 3px; 
  text-align: left; 
  background-color: #FFFFFF; 
  z-index: 10; 
  opacity: .95; 
  filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=2,OffY=2,Color='silver',Positive='true') alpha(opacity=95); 
} 

.LocaleManagementFlyoutPopup A, .LocaleManagementFlyoutPopup A:visited { 
  font-size: 10px; 
  color: #000000; 
  cursor: hand; 
  border: 1px solid #FFFFFF; 
  padding: 1px 3px 1px 3px; 
  height: 15px; 
  text-align: left; 
  text-decoration: none; 
  white-space: nowrap; 
  display: block; 
} 

.LocaleManagementFlyoutPopup A:hover { 
  background-color: #f0f7fd; 
  color: #000000; 
  cursor: hand; 
  border: 1px solid #addbef; 
  padding: 1px 3px 1px 3px; 
  height: 15px; 
  text-decoration: none; 
  white-space: nowrap; 
  display: block; 
} 

.LocaleManagementFlyoutPopupHr { 
 height: 1px; 
 background: #d0e0f0; 
 margin: 0px 11px 21px 11px; 
} 

.LocaleManagementFlyoutPopArrow { 
  margin: 4px 0px 0px 0px; 
} 

.LocaleManagementFlyoutStatic_msdn { 
 border: 1px solid #ffffff; 
} 

.LocaleManagementFlyoutStaticHover_msdn { 
 border: 1px solid #addbef; 
} 

.TFlyPopupAnimate { 
 position: absolute; 
 display: block; 
 border: 1px solid gray; 
 overflow: hidden; 
 visibility: hidden; 
 margin: 0; 
 padding: 0; 
 z-index: 1; 
} 
</style> 
<script> 
/* 
name 对象的 id 值 
offsetLeft 定位:左 - 偏移量 
offsetTop 定位:顶部 - 偏移量 
alignment 对齐方式{-1: left; 0: center; 1: right} 
anyIter 显示方式(<=0: 普通样式; >0: 缩放样式) 
anyTime 动画时间间隔 
staticHover 鼠标覆盖时的样式 
popupHover 显示内容鼠标覆盖时的样式 
popupLatency 显示内容延时 
hideLatency 隐藏内容延时 
onInit 初始化 
onPopup 显示内容时行为 
onHide 隐藏内容时行为 
*/ 
function TFly_Init(name, offsetLeft, offsetTop, alignment, anyIter, anyTime, staticHover, popupHover, popupLatency, hideLatency, onInit, onPopup, onHide) { 
 var TFly = document.getElementById(name); 
 TFly.DT = document.getElementById(name + "_Popup"); // 显示内容对象 
 TFly.F = document.getElementById(name + "_Anim"); // 动画效果对象 
 TFly.oX = offsetLeft; 
 TFly.oY = offsetTop; 
 TFly.alignment = alignment; 
 TFly.AnyIter = anyIter; 
 TFly.AnyTime = anyTime; 

 TFly.popupLatency = popupLatency; 
 TFly.hideLatency = hideLatency; 
 TFly.onPopup = onPopup; 
 TFly.onHide = onHide; 

 TFly.onmouseover = function() { 
 if (staticHover != '') { // 替换样式,并储存原来的样式 
     TFly.className_ = TFly.className; 
      TFly.className = staticHover; 
    } 
 TFly_Popup(TFly, true); 
  } 

 TFly.onmouseout = function() { 
   if (staticHover != '') { // 恢复原来的样式 
     TFly.className = TFly.className_; 
    } 
    TFly_Popup(TFly, false); 
  } 

 if (document.all) { 
 TFly.onactivate = TFly.onmouseover; 
 TFly.ondeactivate = TFly.onmouseout; 
 } else { 
 TFly.onfocus = TFly.onmouseover; 
 TFly.onblur = TFly.onmouseout; 
 } 

 TFly.DT.onmouseover = function() { 
 if (popupHover != '') { 
     TFly.DT.className_ = TFly.DT.className; 
      TFly.DT.className = popupHover; 
    } 
    TFly_Popup(TFly, true); 
  } 

 TFly.DT.onmouseout = function() { 
   if (popupHover != '') { 
 TFly.DT.className = TFly.DT.className_; 
    } 
   TFly_Popup(TFly, false); 
 } 

 TFly_CallClientFunction(onInit, TFly); 
} 

// 调用初始化程序 
function TFly_CallClientFunction(name, TFly) { 
 if (name != null && name != "") 
 eval(name + "(TFly);"); 
} 

// 定位 
function TFly_SetPosition(TFly, obj) { 
 obj.style.top = TFly.oY + TFly.offsetHeight + "px"; 
 obj.style.left = TFly.oX + (TFly.offsetWidth - obj.offsetWidth ) * (1 + TFly.alignment) / 2 + "px"; 
} 

function TFly_Popup(TFly, value) { 
 if (TFly.timer != null) window.clearTimeout(TFly.timer); // 清除超时 

 if (value) { // 判断状态 
 if (TFly.status == "on") return; 

 // 如果 popup 已经显示,则显示延时为 0 
    // 例如从一个菜单移动到另外一个菜单 
    var timeout = (TFly.status == "active") ? 0 : TFly.popupLatency; 

 if (TFly.AnyIter > 0 && TFly.AnyTime > 0) 
 TFly.timer = window.setTimeout(function() {TFly_AnimateStart(TFly, true, TFly.F.curIter);}, timeout); 
 else 
 TFly.timer = window.setTimeout(function() {TFly_SetVisibility(TFly, true);}, timeout); 

 } else { 
 if (TFly.status == "off") return; 

 var timeout = (TFly.status == "active") ? 0 : TFly.hideLatency; 

 if (TFly.AnyIter > 0 && TFly.AnyTime > 0) 
 TFly.timer = window.setTimeout(function() {TFly_AnimateStart(TFly, false, TFly.F.curIter);}, timeout); 
 else 
 TFly.timer = window.setTimeout(function() {TFly_SetVisibility(TFly, false);}, timeout); 
 } 
} 

// 设置弹出内容的可见性 
function TFly_SetVisibility(TFly, value) { 
 if (value == true) { 
 TFly_SetPosition(TFly, TFly.DT); 
 TFly.DT.style.visibility = "visible"; 
 TFly.style.zIndex = "999"; 
 } else { 
 TFly.DT.style.visibility = "hidden"; 
 TFly.style.zIndex = "0"; 
 TFly.DT.style.left = "-10000px"; 
 } 
} 

function TFly_AnimateStart (TFly, inout, curIter) { 
 if (TFly.F.timer != null) window.clearTimeout(TFly.F.timer); 

 if (curIter == null) curIter=0; 

 if (TFly.status != "active") { 
 TFly.status = "active"; 
 TFly.F.style.visibility = "visible"; 
 TFly.DT.style.visibility = "hidden"; 
 } 

 if (curIter < 0 || curIter > TFly.AnyIter) { 
 TFly.F.curIter = (curIter < 1) ? 0 : TFly.AnyIter; 
 TFly.status = (TFly.F.curIter == TFly.AnyIter) ? "on": "off"; 
 TFly.F.style.visibility = "hidden"; 
 TFly_SetPosition(TFly, TFly.DT); 
 TFly.style.zIndex = (TFly.F.curIter == TFly.AnyIter) ? "999" : "0"; 

 if (TFly.F.curIter == TFly.AnyIter) { 
 TFly.status = "on"; 
 TFly_SetVisibility(TFly, true); 
 TFly_CallClientFunction(TFly.onPopup, TFly); 
 } else { 
 TFly.status = "off"; 
 TFly_SetVisibility(TFly, false); 
 TFly_CallClientFunction(TFly.onHide, TFly); 
 } 
 } else { 
 var per = curIter * (95 / TFly.AnyIter) + 5; 
 TFly.F.style.visibility = "hidden"; 
 TFly.F.style.width = TFly.DT.offsetWidth / 100 * per + "px"; 
 TFly.F.style.height = TFly.DT.offsetHeight / 100 * per + "px"; 
 TFly_SetPosition(TFly, TFly.F); 
 TFly.F.style.visibility = "visible"; 
 var timeout = (per == 100 ) ? 0 : TFly.AnyTime - (TFly.AnyTime / (TFly.AnyIter) * (curIter)); 
 curIter += (inout) ? 1 : -1; 
 TFly.F.timer = window.setTimeout(function() {TFly_AnimateStart(TFly, inout, curIter)}, timeout); 
 TFly.F.curIter = curIter; 
 } 
} 
</script> 
</head> 

<body> 
           

<div style="display:inline;vertical-align:middle"> 
  <div class="LocaleManagementFlyoutStatic_msdn" style="position:relative;" id="LocaleManagement"> 
    <a class="LocaleManagementFlyoutStaticLink_msdn" href="javascript:void(0)">United States - English </a><img class="LocaleManagementFlyoutPopArrow" src="http://msdn2.microsoft.com/msdn/Controls/UserRecognitionFlyout/en-us/popdownarrow-msdn-left.gif" alt="Dropdown Arrow" style="height:4px;width:7px;border-width:0px;" /><div id="LocaleManagement_Popup" class="LocaleManagementFlyoutPopup" style="position: absolute;visibility:hidden;left:-65534px;"> 
      <table border="0" style="width:175px;"> 
        <tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl05','')">Australia (English)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl06','')">Brasil (Portugués)</a></td> 

        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl07','')">Canada (English)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl08','')">Canada (Fran?ais)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl09','')">中国 (简体中文)</a></td> 
        </tr><tr> 

          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl10','')">Deutschland (Deutsch)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl11','')">France (Fran?ais)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl12','')">India (English)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl13','')">Россия (Pусский)</a></td> 

        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl14','')">United Kingdom (English)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl15','')">United States (English)</a></td> 
        </tr><tr> 
          <td class="LocaleManagementFlyoutPopupHr"></td> 
        </tr><tr> 
       
            <td><a href="#" target=_blank>更多</a></td> 
        </tr> 
      </table></div> 
      <div id="LocaleManagement_Anim" class="TFlyPopupAnimate"></div> 
  </div> 
   
</div> 

<script> 
TFly_Init('LocaleManagement', 0, 0, -1, 2, 60, 'LocaleManagementFlyoutStaticHover_msdn', '', 100, 400, '', '', ''); 
</script> 


</body> 
</html>

 

分享到:
评论

相关推荐

    javascript网页键盘交互式代码

    以上内容只是JavaScript键盘交互的基础。实际上,你可以通过更多的技术,如防抖(debounce)或节流(throttle)来优化性能,或者利用CSS和HTML5 API来增强用户体验。总之,JavaScript提供了强大的能力,使网页能够响应...

    javascript表单事件汇总

    在深入探讨《javascript表单事件汇总》这一主题之前,我们首先需要理解JavaScript作为一种广泛应用于网页开发的脚本语言,如何通过处理各种事件来增强用户体验、实现动态交互效果。本文将详细解析一系列重要的...

    javascript键盘响应事件

    一、原生JavaScript键盘事件 1. `keydown`事件:当用户按下键盘上的一个键时触发。 2. `keyup`事件:当用户释放键盘上的一个键时触发。 3. `keypress`事件:对于可打印字符,此事件在`keydown`之后、`keyup`之前...

    javascript键盘事件全面控制脚本代码.docx

    ### JavaScript键盘事件全面控制脚本知识点解析 #### 一、概述 在JavaScript中,通过键盘事件可以捕捉用户的键盘输入行为,这对于开发具有交互性的Web应用至关重要。本文将深入探讨如何利用JavaScript来全面控制...

    JavaScript(js)处理的HTML事件、键盘事件、鼠标事件简单示例

    在JavaScript中,事件(Events)是用户或浏览器与页面交互时触发的特定动作,比如点击按钮、按下键盘上的键或者移动鼠标。本文将详细介绍如何使用JavaScript处理HTML事件、键盘事件和鼠标事件。 ### HTML事件处理 ...

    javaScript鼠标键盘事件

    ### JavaScript鼠标键盘事件详解 在Web开发中,JavaScript是实现用户交互的重要手段之一。通过监听用户的鼠标和键盘操作,开发者可以构建出响应式且交互丰富的网页应用。本文将重点介绍几种常用的鼠标和键盘事件...

    JavaScript 操作键盘的Enter事件(键盘任何事件),兼容多浏览器.docx

    在 Web 开发中,JavaScript 操作键盘的 Enter 事件是一种常见的交互方式,例如,在登录页面中,按下 Enter 键 submitting 表单。在多浏览器环境下,实现这种交互方式需要特殊处理。本文将介绍如何使用 JavaScript ...

    jquery 监听 键盘 事件

    在JavaScript的世界里,jQuery库为开发者提供了方便快捷的方式来操作DOM、处理事件、执行动画和Ajax交互。其中,监听键盘事件是常见的用户交互处理之一。本文将深入探讨如何使用jQuery来监听键盘事件,以及相关的...

    JavaScript+jQuery交互式Web前端开发-源代码.zip

    JavaScript 和 jQuery 是现代 Web 前端开发中的两个核心工具,它们共同为创建动态、交互式的网页提供了强大的功能。在本教程中,我们将深入探讨如何将这两种技术与 HTML 和 CSS 结合,以实现高效的网页设计。 ...

    JS网页键盘交互式代码.zip

    通过学习和理解这些代码,开发者可以更好地掌握JavaScript中的键盘事件处理,并将其运用到自己的项目中,提升网页的交互性和用户体验。 总的来说,JS网页键盘交互式代码是JavaScript编程中的一个重要组成部分,它...

    JavaScript程序设计——事件处理实验报告.docx

    实验报告详细介绍了JavaScript事件处理的相关知识,这在Web开发中是非常关键的一部分,因为事件是用户与网页交互的主要方式。以下是对各个知识点的详细说明: 1. **JavaScript事件基本概念**: - **事件**:是用户...

    asp.net控制键盘keycode事件

    键盘事件是浏览器中的JavaScript事件,它们允许我们对用户的键盘操作做出响应。常见的键盘事件有`keydown`、`keyup`和`keypress`。`keydown`事件在用户按下键盘键时触发,`keyup`则在用户释放键时触发,`keypress`...

    javascript的事件大全

    JavaScript事件是JavaScript编程中非常重要的一个概念,它涉及到用户与网页交互的响应机制。事件是用户或浏览器执行特定操作时触发的代码执行点。以下是对JavaScript事件大全的详细解释: 1. 鼠标事件: - onClick...

    Javascript接收键盘输入

    在探讨“Javascript接收键盘输入”这一主题时,我们首先需要理解JavaScript如何与用户进行交互,尤其是在接收用户通过键盘输入信息的场景下。JavaScript是一种广泛应用于网页开发中的脚本语言,它能够实现动态交互...

    JavaScript常用事件

    JavaScript事件是编程中的一种机制,它允许我们对用户在网页上的交互进行响应。这些事件可以是用户的行为,如点击按钮、滚动页面或填写表单,也可以是浏览器内部的状态变化,如页面加载完成或图片加载失败。理解并...

    javascript表单美化和验证插件

    JavaScript 表单美化和验证插件是Web开发中不可或缺的一部分,尤其在构建用户友好且具有交互性的网页时。这类插件通常提供丰富的功能,以提升表单的视觉吸引力和用户体验,同时确保数据的有效性。本插件具备以下关键...

    Javascript软键盘

    1. 自定义脚本:开发者可以手动编写JavaScript代码,定义键盘布局、按键功能以及响应用户交互的事件处理函数。这种方法需要一定的JavaScript基础,但具有高度的灵活性和可定制性。 2. 使用现成的库:市面上存在许多...

    html.rar_html javascript_键盘

    HTML 和 JavaScript 是构建网页交互性的重要工具,而键盘事件是实现用户与网页动态交互的关键环节。在本主题中,我们将深入探讨如何利用 HTML 和 JavaScript 实现对用户键盘输入的监听和处理。 首先,HTML 是超文本...

    Javascript鼠标事件汇总

    ### JavaScript鼠标事件汇总详解 #### 一、基本概念与作用 在前端开发中,JavaScript(简称JS)作为主要的脚本语言,对于处理用户交互至关重要。鼠标事件是JS中最常见的一种事件类型,它能帮助开发者捕捉用户的...

    javascript 和HTML交互.ppt

    3. **键盘和鼠标事件**:键盘事件如`keydown`、`keyup`和`keypress`,鼠标事件如`click`、`mouseover`、`mouseout`、`mousedown`和`mouseup`,它们提供了对用户输入的响应机制,使网页具备更丰富的交互体验。...

Global site tag (gtag.js) - Google Analytics