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

 
(45 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
<html>
 
<html>
 
<style>
 
<style>
−
#mw-content-text {
+
body {
−
    background: #f9f9f9;
+
     background-image: url("https://static.igem.org/mediawiki/2015/</html>{{{3}}}<html>.jpg");
−
     background-image: url("</html>{{{3}}}<html>");
+
    background-size: 100% auto;
 
}
 
}
  
Line 13: Line 13:
 
</style>
 
</style>
  
 +
<script>
 +
$(document).ready(function () {
 +
    var baseline = $("#top_menu_14").height();
 +
    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({
 +
        "transform": "translate3D(0, -100%, 0)",
 +
        "top": baseline + "px"
 +
    });
 +
 +
    $("article h2").each(function (index, item) {
 +
        var $temp = $(item).clone();
 +
        $temp.children().remove();
 +
        $("ul.sub-nav").append($("<li>").append(
 +
            $("<a>").addClass("btn-filter btn")
 +
                .attr("data-tartget", index)
 +
                .text($temp.text())
 +
        ));
 +
    });
 +
 +
    $("ul.sub-nav").append($("<li>").append(
 +
        $("<a>").addClass("btn-filter btn")
 +
            .attr("href", "#")
 +
            .text("Top ▴")
 +
    ));
 +
 +
    $("ul.sub-nav a").click(function () {
 +
        $("html, body").animate({scrollTop: $($("article h2")[$(this).attr("data-tartget")]).offset().top - $(".sub-header").height()}, "slow");
 +
    });
 +
 +
    $(document).scroll(function (event) {
 +
        if (($(window).scrollTop() <= $(".navbar-siren").height() + baseline)) {
 +
            $(".sub-header").css({
 +
                "transform": "translate3D(0, -100%, 0)"
 +
            });
 +
        } else {
 +
            $(".sub-header").css({
 +
                "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>
 +
<div class="sub-header text-right">
 +
    <ul class="sub-nav col-md-12">
 +
    </ul>
 +
</div>
 
<div class="content container">
 
<div class="content container">
 
     <article class="col-lg-10 col-lg-offset-1 col-md-12 col-md-offset-0 col-sm-12 col-sm-offset-0">
 
     <article class="col-lg-10 col-lg-offset-1 col-md-12 col-md-offset-0 col-sm-12 col-sm-offset-0">

Latest revision as of 01:33, 19 September 2015

{{{1}}}{{{2}}}