Oscarliu117 (Talk | contribs) |
Oscarliu117 (Talk | contribs) |
||
Line 13: | Line 13: | ||
<div class="navbar-example"> | <div class="navbar-example"> | ||
<div class="row"> | <div class="row"> | ||
+ | <div class="col-2 side"> | ||
+ | <div id="sidelist" class="list-Fgroup"> | ||
+ | <a class="list-group-item list-group-item-action" href="#list-item-1">Accomplishment</a> | ||
+ | <a class="list-group-item list-group-item-action" href="#list-item-2">Introduction</a> | ||
+ | <a class="list-group-item list-group-item-action" href="#list-item-3">Device design</a> | ||
+ | <a class="list-group-item list-group-item-action" href="#list-item-4">Bioreactor</a> | ||
+ | <a class="list-group-item list-group-item-action" href="#list-item-5">Nutrient tank</a> | ||
+ | <a class="list-group-item list-group-item-action" href="#list-item-6">pH Meter</a> | ||
+ | <a class="list-group-item list-group-item-action" href="#list-item-7">CO2 Sensor</a> | ||
+ | <a class="list-group-item list-group-item-action" href="#list-item-8">Temperature Sensor</a> | ||
+ | <a class="list-group-item list-group-item-action" href="#list-item-9">Wi-fi sensor</a> | ||
+ | <a class="list-group-item list-group-item-action" href="#list-item-10">Materials required</a> | ||
+ | <a class="list-group-item list-group-item-action" href="#list-item-11">Reference</a> | ||
+ | <a class="list-group-item list-group-item-action" href="#"><i class="fa fa-arrow-up fa-1x" | ||
+ | aria-hidden="true"></i> | ||
+ | </a> | ||
+ | </div> | ||
+ | </div> | ||
<div class="col-10"> | <div class="col-10"> | ||
<div data-spy="scroll" data-target="#sidelist" data-offset="0" class="scrollspy-example"> | <div data-spy="scroll" data-target="#sidelist" data-offset="0" class="scrollspy-example"> | ||
Line 324: | Line 342: | ||
</div> | </div> | ||
</div> | </div> | ||
+ | |||
+ | |||
+ | <script> | ||
+ | $(document).ready(function () { | ||
+ | $(window).scroll(function () { | ||
+ | if ($(this).scrollTop() >= 90) { | ||
+ | var position = $("#sidelist").position(); | ||
+ | if (position == undefined) {} else { | ||
+ | $('#sidelist').css({ | ||
+ | "position": "fixed", | ||
+ | "top": "145px", | ||
+ | "margin-top": "0px" | ||
+ | }); | ||
+ | } | ||
+ | } else { | ||
+ | $('#sidelist').removeAttr('style'); | ||
+ | } | ||
+ | }); | ||
+ | $(function () { | ||
+ | $('i.fa-arrow-up').click(function () { | ||
+ | $('html, body').animate({ | ||
+ | scrollTop: 0 | ||
+ | }, 600); | ||
+ | return false; | ||
+ | }); | ||
+ | }); | ||
+ | }); | ||
+ | </script> | ||
+ | |||
</body> | </body> | ||
</html> | </html> | ||
{{NCKU_Tainan/footer}} | {{NCKU_Tainan/footer}} |
Revision as of 05:38, 22 September 2018