|
|
| (20 intermediate revisions by the same user not shown) |
| Line 1: |
Line 1: |
| | {{ATOMS-Turkiye/Test}} | | {{ATOMS-Turkiye/Test}} |
| | <html> | | <html> |
| | + | <div id="page-wrapper"> |
| | + | <script> |
| | + | $(document).ready(function(){ |
| | + | $("#headerWrapper").sticky({topSpacing:34}); |
| | + | $("nav.scroll-nav").sticky({topSpacing:57}); |
| | + | |
| | + | }); |
| | + | </script> |
| | <style> | | <style> |
| | + | .img-right{ |
| | + | |
| | + | padding:0px !important; |
| | + | } |
| | + | .img-left{ |
| | + | padding:0px !important; |
| | + | } |
| | + | .img-center{ |
| | + | padding:0px !important; |
| | + | } |
| | + | |
| | + | h2.scroll{ |
| | + | margin-top: 0px !important; |
| | + | |
| | + | } |
| | @media (max-width: 1185px) { | | @media (max-width: 1185px) { |
| | #footer{ | | #footer{ |
| − | margin-bottom: -315px}
| + | margin-bottom: -285px;} |
| | + | } |
| | + | div#content { |
| | + | margin-top: -12px; |
| | + | } |
| | + | #headerWrapper { |
| | + | margin-top:-67px !important; |
| | } | | } |
| − | /*div#content {
| |
| − | padding-bottom: 150px;
| |
| − | }*/
| |
| | h2.scroll{ | | h2.scroll{ |
| | display:none | | display:none |
| | + | } |
| | + | .scroll-nav{ |
| | + | margin-top:17px |
| | } | | } |
| | #content-div{ | | #content-div{ |
| Line 20: |
Line 49: |
| | .tour-right, .tour-right p{ | | .tour-right, .tour-right p{ |
| | font-family:'SegoePrint-Regular'; | | font-family:'SegoePrint-Regular'; |
| − | width: 250px; | + | width: 280px; |
| | float: right; | | float: right; |
| | padding-top: 50px; | | padding-top: 50px; |
| Line 66: |
Line 95: |
| | -o-border-radius: 2px; | | -o-border-radius: 2px; |
| | border-radius: 2px; | | border-radius: 2px; |
| − | }
| |
| − | h2.scroll{
| |
| − | margin-top: 0px !important;
| |
| − |
| |
| | } | | } |
| | #footer{/*bottom:-240px*/} | | #footer{/*bottom:-240px*/} |
| | </style> | | </style> |
| − | <div id="page-wrapper">
| |
| | <div class="main"> | | <div class="main"> |
| | <article class="post__article"> | | <article class="post__article"> |
| | | | |
| − | <div id="content-div" style="height:100%;width:1040px;padding:30px;padding-top:90px;padding-bottom:10px"> | + | <div id="content-div" style="height:100%;width:1035px;padding:30px;padding-top:90px;padding-bottom:10px"> |
| | <h1 style="font-family:'SegoePrint-Regular';left:0px; right: 230px; padding-top:0px;color:black;font-size:25px;position:absolute;left:0px;right:0px;margin-right:480px;">Welcome to Tour Section</h1> | | <h1 style="font-family:'SegoePrint-Regular';left:0px; right: 230px; padding-top:0px;color:black;font-size:25px;position:absolute;left:0px;right:0px;margin-right:480px;">Welcome to Tour Section</h1> |
| | <div class="tour-centered" style="width:900px;"> | | <div class="tour-centered" style="width:900px;"> |
| Line 144: |
Line 168: |
| | <h2 class="scroll">...</h2> | | <h2 class="scroll">...</h2> |
| | <div id="content-div" style="width:140px;height:60px;font-size:24px;"> | | <div id="content-div" style="width:140px;height:60px;font-size:24px;"> |
| − | <p style="padding-top:15px;font-family:'SegoePrint-Regular';margin-left:-5px;">-the end-</p> | + | <p style="padding-top:15px;font-family:'SegoePrint-Regular';margin-left: -15px; |
| | + | font-weight: 600;">- The End -</p> |
| | </div> | | </div> |
| | </article> | | </article> |
| | </div> | | </div> |
| − | </div>
| + | |
| | <script> | | <script> |
| − | $('.post__article').scrollNav({
| + | $('.post__article').scrollNav({ |
| | sections: 'h2.scroll', | | sections: 'h2.scroll', |
| − | subSections: false, | + | subSections: true, |
| | sectionElem: 'div', | | sectionElem: 'div', |
| | showHeadline: false, | | showHeadline: false, |
| Line 158: |
Line 183: |
| | showTopLink: true, | | showTopLink: true, |
| | topLinkText: 'Top', | | topLinkText: 'Top', |
| − | fixedMargin: 100, | + | fixedMargin: 40, |
| − | scrollOffset: 140, | + | scrollOffset: 110, |
| | animated: true, | | animated: true, |
| | speed: 500, | | speed: 500, |
| Line 170: |
Line 195: |
| | onDestroy: null | | onDestroy: null |
| | }); | | }); |
| | + | var $; |
| | + | var observer_target = document.querySelector('.post__article'); |
| | + | var observer = new MutationObserver(function(mutations) { |
| | + | mutations.forEach(function() { |
| | + | $.fn.scrollNav('resetPos'); |
| | + | }); |
| | + | }); |
| | + | var observer_config = { |
| | + | attributes: true, |
| | + | childList: true, |
| | + | characterData: true, |
| | + | subtree: true |
| | + | }; |
| | + | observer.observe(observer_target, observer_config); |
| | + | |
| | + | |
| | + | $('.box').hide(); |
| | + | |
| | + | // Make sure all the elements with a class of "clickme" are visible and bound |
| | + | // with a click event to toggle the "box" state |
| | + | $('.clickme').each(function() { |
| | + | $(this).show(0).on('click', function(e) { |
| | + | // This is only needed if your using an anchor to target the "box" elements |
| | + | e.preventDefault(); |
| | + | |
| | + | // Find the next "box" element in the DOM |
| | + | $(this).next('.box').slideToggle('fast'); |
| | + | }); |
| | + | }); |
| | + | |
| | + | function toggle_visibility(id) { |
| | + | var e = document.getElementById(id); |
| | + | if(e.style.display == 'none') |
| | + | e.style.display = 'inline'; |
| | + | else |
| | + | e.style.display = 'none'; |
| | + | } |
| | + | |
| | + | |
| | + | |
| | + | function scrollOpen(id){if($(id)==undefined)return; |
| | + | $('html, body').animate({ |
| | + | scrollTop: $(id).offset().top-100 |
| | + | },0); |
| | + | $(id).click();} |
| | + | |
| | + | $(function(){ |
| | + | scrollOpen(window.location.hash); |
| | + | }); |
| | + | |
| | </script> | | </script> |
| | | | |
| | + | </div> |
| | </html> | | </html> |
