Question

我想制作一个菜单，当有人点击我的菜单时，它会将它们移动到他点击的内容，因为网站很长，这样会更容易。有什么想法/建议吗？

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<table  width="650"  border="0" cellpadding="0" cellspacing="0" align="center">
    <tr>
        <td>
          <img src="" usemap="#Map" width="650" height="84" alt="plasio.gr" style="display:block; vertical-align:bottom;background-color:#FFD6CC;color:#000000;text-align:center;font-size:20px;font-family: Arial, Helvetica, sans-serif;"></td>
    </tr>

    </table>

    <map name="Map">
  <area shape="rect" coords="-51,-2,174,39" href="link1">
<area shape="rect" coords="85,53,149,86" href="link2">
</map>
</body>
</html>

Answer 1

您可以使用主播链接

来完成此操作

使用锚链接，您可以链接到网站的特定部分。您可以使用主题标签（＃）在页面中进行链接。单击链接时，它将自动转到页面中具有id或name的部分，该部分等于标签后面的文本（＃）

JSfiddle

示例

<a href="#link1">Link 1</a> <a href="#link2">Link 2</a> <div> <a name="link1"></a> Section 1 </div> <div id="link2"> Section 2 </div>

Answer 2

试试这个。也许你有一个名为page.html的页面，其代码如下

<div id="part1">
  <p>Lorem Ipsum</p>
</div>

<div id="part2">
  <p>Lorem Ipsum</p>
</div>

<div id="part3">
  <p>Lorem Ipsum</p>
</div>

要移至指定的部分，请创建<a class="button" href="page.html#part1"">Part 1</a>或

<a class="button" href="page.html#part2"">Part 2</a>

或者，您可以使用jquery视差插件，例如https://github.com/IanLunn/jQuery-Parallax或其他https://github.com/balupton/jquery-scrollto

你可以使用jquery easing来获得一些很好的效果作为你的滚动。

按钮移动网站内容

2 个答案: