0

我有 2 个 html 文件：

  • 索引.html
  • 投资组合.html

在portfolio.html 中，我的作品分为4 类：网络、3d、代码和视频。此外，我还包含了一个过滤器脚本，它仅显示所选类别的工作并且它正在工作。

在 index.html 中，我需要有指向我的投资组合每个类别的链接，但我不知道该怎么做。

以下是代码：

索引.html：

...
<a href="portfolio.html#web"><img src="img/web.png"></a>
<a href="portfolio.html#triD"><img src="img/triD.png"></a>
<a href="portfolio.html#codes"><img src="img/codes.png"></a>
<a href="portfolio.html#video"><img src="img/video.png"></a>
...

投资组合.html：

...
<!-- filter goes here: -->
<p id="picker">
    <a href="#" id="all" class="current" name="all">All</a> | 
    <a href="#" id="web" class="filter" name="web">Web</a> | 
    <a href="#" id="triD" class="filter" name="triD">3D</a> | 
    <a href="#" id="codes" class="filter" name="codes">Codes</a> | 
    <a href="#" id="video" class="filter" name="video">Video</a>
</p>

<!-- my work goes here: -->
<div class="my-work codes">...</div>
<div class="my-work web">...</div>
<div class="my-work triD">...</div>
<div class="my-work codes">...</div>
...

过滤器.js：

$(function()
{   
   $("#all").click(function(){
       $(".my-work").slideDown();
       $("#catpicker a").removeClass("current");
       $(this).addClass("current");
       return false;
   });

   $(".filter").click(function(){
        var thisFilter = $(this).attr("id");
        $(".my-work").slideUp();
        $("."+ thisFilter).slideDown();
        $("#catpicker a").removeClass("current");
        $(this).addClass("current");
        return false;
   });

});
4

1 回答 1

0

其实我已经找到了我的问题的正确答案。在portfolio.html中，在header中的所有脚本之后，应该添加以下脚本：

$(document).ready(function()
{
    var type = window.location.hash;
    //window.location.hash = window.location.hash.replace(type,''); //should be added if you want to remove: ...#class in address bar
    $(type).trigger('click');
});
于 2012-04-25T18:04:28.350 回答