加载中…
个人资料
糖炒栗子
糖炒栗子
  • 博客等级:
  • 博客积分:0
  • 博客访问:32,496
  • 关注人气:13
  • 获赠金笔:0支
  • 赠出金笔:0支
  • 荣誉徽章:
相关博文
推荐博文
谁看过这篇博文
加载中…
正文 字体大小:

JS左右页答进行切换,内容随之变化

(2010-04-07 10:38:41)
标签:

杂谈

分类: JS学习班
一个页面分左右两部分..左右两边里套用框架(里面分别包含一个新页面),要实现当鼠标在左边区域时右边框架就隐藏,反之也是。。。。。。。。
效果图:
JS左右页答进行切换,内容随之变化

JS左右页答进行切换,内容随之变化


<script>// Example: obj = findObj("image1");
function findObj(theObj, theDoc)
{
  var p, i, foundObj;
 
  if(!theDoc) theDoc = document;
  if( (p = theObj.indexOf("?")) > 0 && parent.frames.length)
  {
    theDoc = parent.frames[theObj.substring(p+1)].document;
    theObj = theObj.substring(0,p);
  }
  if(!(foundObj = theDoc[theObj]) && theDoc.all) foundObj = theDoc.all[theObj];
  for (i=0; !foundObj && i < theDoc.forms.length; i++)
    foundObj = theDoc.forms[i][theObj];
  for(i=0; !foundObj && theDoc.layers && i < theDoc.layers.length; i++)
    foundObj = findObj(theObj,theDoc.layers[i].document);
  if(!foundObj && document.getElementByIdx) foundObj = document.getElementByIdx(theObj);
 
  return foundObj;
}
</script>
<style type="text/css">
<!--
body {
    margin: 0px;
    background-color: buttonface;
    overflow: hidden;
    border: 0px;
}
.ctrlbar {
    border: 1px inset;
}
.explorer {
    background-color: #FFFFFF;
    border: 1px inset;
}
.ctbutton {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 8px;
    background-color: #eeeeee;
    border-width: 1px;
    width: 9px;
    height: 100px;
    margin-bottom: 100px;
}
-->
</style>
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td width="150" align="center" valign="top" class="explorer" id="menubar"><br />      <br />
      <br />     
    </td>
    <td width="1" class="ctrlbar"><button class="ctbutton" onfocus="blur();" onmouseup="with(findObj('menubar').style){display=display=='none'?'':'none';this.innerText=display=='none'?'>':'<'}" onmouseover="this.style.backgroundColor='#ffffff'" onmouseout="this.style.backgroundColor='#eeeeee'"><</button></td>
    <td class="explorer">
</td>
  </tr>
</table>

0

阅读 评论 收藏 转载 喜欢 打印举报/Report
  • 评论加载中,请稍候...
发评论

    发评论

    以上网友发言只代表其个人观点,不代表新浪网的观点或立场。

      

    新浪BLOG意见反馈留言板 电话:4000520066 提示音后按1键(按当地市话标准计费) 欢迎批评指正

    新浪简介 | About Sina | 广告服务 | 联系我们 | 招聘信息 | 网站律师 | SINA English | 会员注册 | 产品答疑

    新浪公司 版权所有