How to load an appened tag onto a URL on page load

Question

How to load an appened tag onto a URL on page load

65 views Asked by user2833068 At 21 November 2013 at 04:12

I know there are more efficient ways at doing this but I have my reasons for doing it this way. I have a modal popup window. I would like for this window to pop up as soon as the visitor loads the page. As of right now the window is reached and opened by clicking a link that takes them to index.php#login_form.

"#login_form" being what I would like to add the URL on page load. Then they can chose to exit it once it has initially loaded with the popup.

Now is there a way to do this more efficiently with out having to change my css or code very much?

Thanks!

Original Q&A

There are 3 answers

Sun Liwen On 21 November 2013 at 04:32

The hash in url can be accessed through window.location.hash in javascript. You can judge this in body onload event.

Gaurav On 21 November 2013 at 04:37

To answer your question I have created a fiddle, that takes your example and solves what you are looking for. http://jsfiddle.net/sgaurav/xA4vG/

Basically what this code is doing is, selects the id of click you want to simulate and then creates a mouse event for click as per answer given here How do I simulate user clicking a link in JQuery?

$.fn.simulateClick = function() {
    return this.each(function() {
        if('createEvent' in document) {
            var doc = this.ownerDocument,
                evt = doc.createEvent('MouseEvents');
            evt.initMouseEvent('click', true, true, doc.defaultView, 1, 0, 0, 0, 0, false, false, false, false, 0, null);
            this.dispatchEvent(evt);
        } else {
            this.click(); // IE
        }
    });
}

Now this code is used onload event of body to fake a click on the link that you are doing manually till now using

jQuery(document).load(
    jQuery('#join_pop').simulateClick()
);

This in turn loads popup as soon as page opens up. You can change id in last code to the login form if you want and that will start showing up on page load instead of sign up.

**Dan** · Accepted Answer · 2013-11-21T04:23:47+00:00

One easy way is to load the page directly with the hashtag login_form:

http://www.script-tutorials.com/demos/222/index.html#login_form

Or if you want to be more "precise" you can use jquery like this:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<body>

<!--Place this at the end of the body tag.-->
<script>
$(function(){
   window.location.hash = "login_form"; //this will add with js the #login_form hash at the end of th url
})
</script>

You can use jquery to show the modal when the window is loaded: Try this code and you'll understand:

$(function(){
   alert("Done loading");   
})

You'll add the code to show the modal instead of the alert function. If the modal is shown or hidden with css, you can easily add a css class to an element with:

$(".element").addClass("showModal);

Or remove a class with:

 $(".element").removeClass("hideModal");

Be sure to have the jquery library imported. I hope this answers your question.

TechQA.

How to load an appened tag onto a URL on page load

There are 3 answers

Related Questions in HTML

Related Questions in CSS

Related Questions in MODALPOPUPS

Popular Questions

Popular Tags

Trending Questions