jquery - Trigger Javascript with URL parameter -
i using snippet fade content div when specific link clicked....
<script language="javascript"> $(document).ready(function () { $('#section1, #section2, #section3').addclass('js'); $('#content-container a').click(function (e) { e.preventdefault(); var rel = $(this).attr('rel'); $('#' + rel).fadein().siblings('div').fadeout(); }); var link = document.url.split('#')[1]; if (link) { var el = $('#' + link); if (el) el.click(); } }); </script> is there way load specified content using url instead of clicking? can link www.mydomain.com/mypage.php#section2 or similar?
update
here jsfiddle of simplified code http://jsfiddle.net/k6rhr/
try this
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>mouseover demo</title> <script src="http://code.jquery.com/jquery-2.1.0.min.js"></script> <style> .invisible { display: none; } .lorem { height: 300px; } </style> <script type="text/javascript"> $(document).ready(function () { getcontent(); }); $(window).bind('hashchange', function (e) { getcontent(); }); function getcontent() { var url = window.location.tostring(); var hash = url.substring(url.indexof('#')); $('html, body').animate({ scrolltop: $(hash).offset().top }, 2000); $(hash).fadein(); $(hash).siblings("div").fadeout(); } </script> </head> <body> <div class="lorem"> <div id="section1" class="invisible"> content 1 <p style="text-align: justify;"> content 1 content</p> </div> <div id="section2" class="invisible"> content 2 <p style="text-align: justify;"> content 2 content</p> </div> <div id="section3" class="invisible"> content 3 <p style="text-align: justify;"> content 3 content</p> </div> <div id="section4" class="invisible"> content 4 <p style="text-align: justify;"> content 4 content </p> </div> </div> <div id="links"> <a href="#section1" rel="section1" id="section1">section 1</a> <br /> <a href="#section2" rel="section2" id="section2">section 2</a> <br /> <a href="#section3" rel="section3" id="section3">section 3</a> <br /> <a href="#section4" rel="section4" id="section3">section 4</a> </div> </body> </html> is looking for. on load page #section show content. on click of anchor hash link changed , hash change function load in required content.
if have query please let me know.
Comments
Post a Comment