为框架集中的框架设置隐藏和显示按钮

Hide and show button for frames in framesets

本文关键字：框架 显示 按钮 隐藏 设置 集中      更新时间：2023-09-26

我正在制作一个在页面两侧的框架集中有两个框架的项目。左边的框架叫"左"，右边的框架叫"右"。我试图为左帧分配一个"隐藏/显示"按钮;该按钮将被分配到左框架上，它将隐藏左框架，从而使右框架更宽。我试着搜索，但我没有解决办法。

我是网页设计的新手，所以，如果有人能帮我一把，那将是我的荣幸。我希望我没有把事情弄得太复杂。

谢谢你,期待您的回复.........

正如其他人提到的，框架可能会给您带来麻烦。最简单的方法可能是将两列分开包装。<body>标记上的一个类规定了两者的宽度和可见性。"隐藏"answers"显示"最左边的列的过程只是使用javascript切换哪个类在body标签上的问题。

下面是一个简单的例子。

<body class="two-col">
  <div class="sidebar">
    <a id="hide-sidebar">Hide</a>
    Left
  </div>
  <div class="main">
    Right
  </div>
</body>
body.two-col .sidebar {
  width: 25%;
  position: absolute;
  top: 0;
  left: 0;
}
body.two-col .main {
  width: 75%;
  margin-left: 25%;
}
body.one-col .sidebar {
  display: none;
}
$('#hide-sidebar').click(function() {
  body = $('body');
  if (body.hasClass('one-col')) {
    body.addClass('two-col').removeClass('one-col');
  } else {
    body.addClass('one-col').removeClass('two-col');
  }
});
相关文章：