`
ghost_fly
  • 浏览: 108723 次
  • 性别: 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 和HTML交互.ppt

    事件处理模型: 1、窗口事件 2、表单元素事件 3、键盘事件 4、鼠标事件 文档对象模型-DOM及各类对象、属性和方法等

    JavaScript经典实例

     第14章使用JavaScript、CSS和ARIA创建交互和可访问性效果  第15章创建富媒体和交互应用程序  第16章JavaScript对象  第17章JavaScript库  第18章通信  第19章使用结构化数据  第20章持久化  第21章...

    精通javascript

    • 11.8.htm JavaScript实现事件控制器 • 11.9.htm 元素属性综合应用 • 11.10.htm 动态修改表单元素内容 第12章(\第12章) • 12.1.htm Document树的简单例子 • 12.2....

    精通JavaScript

    • 11.8.htm JavaScript实现事件控制器 • 11.9.htm 元素属性综合应用 • 11.10.htm 动态修改表单元素内容 第12章(\第12章) • 12.1.htm Document树的简单例子 • 12.2....

    客户端统一验证JavaScript函数库及示例源码

    参数myform指代验证的表单,可以比作验证树DOM的根,之后的JavaScript会遍历所有元素(elements),逐个检验,若没有设置验证则直接跳过,若有一个验证不通过,都不会将表单提交,并将光标定位到该处(focus()),若有...

    bespoke-forms:Bespoke.js的表单元素支持

    防止表单元素内部的键盘事件与演示文稿进行交互。 下载 下载或,或使用。 用法 该插件以,这意味着它可以作为CommonJS / AMD模块或全局浏览器使用。 例如,当使用CommonJS模块时: var bespoke = require ( '...

    javascript-challenge

    该项目演示了如何使用Javascript创建交互式网站,特别是使用D3.js来收集DOM(文档对象模型)形式HTML表单元素,并向页面上的元素添加事件触发器,从而根据用户输入过滤给定的数据集。 该数据集是在美国发现的不明...

    fl-interactive-form:与fl-form-b​​uilder兼容的交互式表单

    生成外观漂亮的表单,可以使用键盘键进行导航。 开源,灵感来自Typeform 。 快速开始 要创建表单,只需调用flInteractiveForm.create ,并使用来自form-builder的配置对象和一个目标元素来创建表单。 您将在页面中...

    js-interactive-reg-form:该项目是一个交互式注册表单,可验证虚拟全栈会议的用户输入

    js-interactive-reg-form 该项目是一个交互式注册... 如果在任何或所有必需的用户输入为空/无效的情况下单击“提交”按钮,则表单不会提交,键盘焦点会将用户的注意力转移到错误上,并显示一条有用的“提示”消息。

    JavaScript高级教程

    第 1 章 JavaScript 是什么...............................................1 3 1.1 历史简述..............................................1 1.2 JavaScript 实现................................................

    UiBase:在为用户界面编程时,代码的一个主要期望是描述交互点之间的连接。 UiBase 的目标是成为一个完整的前端框架,以这种思想为核心。 除了“组件驱动”方法外,其他亮点几乎是当今框架的典型特征

    一些主要功能: ...支持键盘快捷键以实现流畅的用户交互 最后是最重要的一个 - 易于调试的开发模式和最佳性能的生产模式 大量示例应用程序让您快速入门 非常感谢 Debjit 带来了他的孩子: GUI 构建器

    Curriculum:课程主题的分类

    色彩理论人机交互平衡版式对比一致性设计思维设计系统和样式指南交互设计方法:目标驱动设计,可用性,五个维度,认知心理学和人机交互指南设计策略第4周-网络可访问性键盘快捷键基于焦点的元素焦点控制跳过链接...

    Eclipse_Swt_Jface_核心应用_部分19

    8.3.2 键盘事件的各种属性 134 8.4 鼠标事件 136 8.4.1 鼠标事件程序示例 136 8.4.2 鼠标事件的各种属性 139 8.5 其他常用的事件 139 8.5.1 选中事件 139 8.5.2 文本修改程序示例 140 8.5.3 文本修改...

    Ext Js权威指南(.zip.001

    5.5.1 为元素绑定键盘事件:ext.util.keymap / 201 5.5.2 键盘导航:ext.util.keynav / 204 5.6 综合实例:股票数据的实时更新 / 205 5.7 本章小结 / 214 第6章 选择器与dom操作 / 215 6.1 ext js的选择器:...

    JAMstack-Curriculum:课程主题的课程细分

    第 3 周 - 用户体验/交互设计 设计心理学(以用户为中心的设计) 色彩理论 平衡 排版 对比 一致性 设计策略 第 4 周 - 网络可访问性 键盘快捷键 基于焦点的元素 对焦控制 跳过链接 咏叹调 色彩比例 第 5 周 ...

    自动填充「Autofill」-crx插件

    Autofill扩展程序具有一个目的:在页面加载时自动填充表单字段,而无需用户进行任何交互。这是它的主要功能,但是它可以做的更多 Google Chrome浏览器具有内置的自动填充功能,但不适用于所有表单字段,并且需要您从...

    免费轻巧简约极速 PDF 阅读工具 MuPDF 1.14.0 中文汉化版.zip

    官网介绍里写着 MuPDF 支持透明度、加密、超链接、注释、搜索,另外在文件包中,还有一个 mupdf-v8.exe 的文件,可选支持交互式功能,如表单填写、javascript 和转换。 MuPDF 还支持 .xps .cbz .zip .png .jpe .tif...

    ExtAspNet v2.2.1 (2009-4-1) 值得一看

    -如何自定义Javascript脚本和C#处理函数来响应键盘事件。 -为Tree增加AutoLeafIdentification属性。 -增加示例(tree_auto_leaf_identification.aspx)(feedback:wdrabbit)。 +2009-11-17 v2.1.4 -修正...

Global site tag (gtag.js) - Google Analytics