Difference between revisions of "Template:BNU-CHINA/article"

 
(26 intermediate revisions by the same user not shown)
Line 15: Line 15:
 
<script>
 
<script>
 
$(document).ready(function () {
 
$(document).ready(function () {
 
 
     var baseline = $("#top_menu_14").height();
 
     var baseline = $("#top_menu_14").height();
     console.log(baseline - $(".sub-header").height() + "px");
+
     var scrollToHash = function(hash) {
 +
        if (hash.indexOf("#") == 0) {
 +
            var $target = $(hash);
 +
            $("html, body").animate({scrollTop: $target.offset().top - $(".sub-header").height() - baseline + 2}, "slow");
 +
        }
 +
    };
 +
 
  
 
     $(".sub-header").css({
 
     $(".sub-header").css({
        "top": baseline + "px"
+
        "transform": "translate3D(0, -100%, 0)",
 +
        "top": baseline + "px"
 
     });
 
     });
  
 
     $("article h2").each(function (index, item) {
 
     $("article h2").each(function (index, item) {
         $("ul.sub-nav").prepend($("<li>").append(
+
        var $temp = $(item).clone();
 +
        $temp.children().remove();
 +
         $("ul.sub-nav").append($("<li>").append(
 
             $("<a>").addClass("btn-filter btn")
 
             $("<a>").addClass("btn-filter btn")
 
                 .attr("data-tartget", index)
 
                 .attr("data-tartget", index)
                 .text($(item).text())
+
                 .text($temp.text())
 
         ));
 
         ));
 
     });
 
     });
 +
 +
    $("ul.sub-nav").append($("<li>").append(
 +
        $("<a>").addClass("btn-filter btn")
 +
            .attr("href", "#")
 +
            .text("Top ▴")
 +
    ));
  
 
     $("ul.sub-nav a").click(function () {
 
     $("ul.sub-nav a").click(function () {
         $("html, body").animate({scrollTop: $($("article h2")[$(this).attr("data-tartget")]).offset().top - $(".sub-header").height() - baseline}, "slow");
+
         $("html, body").animate({scrollTop: $($("article h2")[$(this).attr("data-tartget")]).offset().top - $(".sub-header").height()}, "slow");
 
     });
 
     });
  
Line 38: Line 52:
 
         if (($(window).scrollTop() <= $(".navbar-siren").height() + baseline)) {
 
         if (($(window).scrollTop() <= $(".navbar-siren").height() + baseline)) {
 
             $(".sub-header").css({
 
             $(".sub-header").css({
                 "transform": "translate3D(0, -100%, 0)",
+
                 "transform": "translate3D(0, -100%, 0)"
 
             });
 
             });
 
         } else {
 
         } else {
 
             $(".sub-header").css({
 
             $(".sub-header").css({
                 "transform": "translate3D(0, 0, 0)",
+
                 "transform": "translate3D(0, 0, 0)"
 +
            });
 +
        }
 +
 
 +
        var currentIdx = -1;
 +
        $("article h2").each(function (index, item) {
 +
            if($(window).scrollTop() > $(item).offset().top - baseline - $(".sub-header").height()) {
 +
                currentIdx = index;
 +
            }
 +
        });
 +
 
 +
        if($(window).scrollTop() + $(window).height() == $(document).height()) {
 +
            currentIdx = $("article h2").length - 1;
 +
        }
 +
 
 +
        $("ul.sub-nav a").css({
 +
            "color": "#278A75"
 +
        });
 +
 
 +
        if (currentIdx >= 0) {
 +
            $($("ul.sub-nav a")[currentIdx]).css({
 +
                "color": "#D3853D"
 
             });
 
             });
 
         }
 
         }
 
     });
 
     });
 +
 +
    $("a[href]").on("click", function() {
 +
        var hash = this.href.substring(this.href.indexOf("#"));
 +
        scrollToHash(hash);
 +
    });
 +
 +
    scrollToHash(window.location.hash);
 +
 
});
 
});
 
</script>
 
</script>
 
<div class="sub-header text-right">
 
<div class="sub-header text-right">
 
     <ul class="sub-nav col-md-12">
 
     <ul class="sub-nav col-md-12">
        <li><a class="btn-filter btn" href="#">Top ▴</a></li>
 
 
     </ul>
 
     </ul>
 
</div>
 
</div>

Latest revision as of 01:33, 19 September 2015