Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

JavaScript

Show Div using URL

Okay so I have the following:

<div class="login">
    <div class="close_login"></div>

    <form name="loginform" id="loginform" action="<?php echo site_url(); ?>/wp-login.php"        
 method="post"  class="login-form">
    <ul class="login_form">
        <li><input type="text" name="log" id="user_login" class="input" value="" 
                        size="20" placeholder="Username"/></li>

        <li>
        <input type="password" name="pwd" id="user_pass" class="input" 
                        value="" size="20" placeholder="Password"/>
    </li>

        <li><input type="submit" name="wp-submit" id="wp-submit" class="button-
                        primary" value="Log In" />
        <input type="hidden" name="redirect_to" 
                       value="<?php echo $_SERVER['REQUEST_URI']; ?>" />
                       </li>
        </ul>

    </form>
            </div> 

and the following jQuery

<script>

 $( document ).ready(function() {
    $("#menu-item-login").click(function () {
    $(".signup").slideUp();
    $(".login").slideDown();
    $(".close_login").slideDown();
});
  $(".close_login").click(function () {
    $(".login").slideUp();
    $(".close_login").slideUp();
});
  $("#wp-submit").click(function () {
    $(".login").slideUp();
    $(".close_login").slideUp();
});
   });

</script>

Now the following will show login after clicking on button (not in example) Now how can I get login to automatically appear if I add #login to the end of the url?

Aled

4 Answers

I'm not entirely sure how much 'answering' is meant to be done on the forums, or if we're just meant to guide you in the correct direction However, documents.location.href would be the URL of the page (www.mysite.com), and indexOf checks the location of a give phrase in the string (I believe it was discussed in the validation video). It returns -1 on failure, and the location on success (0-9)

Your code should then be

if(document.location.href.indexOf('#login') > -1) {
// It exists in the URL, continue
}

You could use indexOf() on window.location.href, to see if the term "#login" exists in the URL. Then show and hide content depending on the result of that.

Thanks for the reply :) I have no idea how to do that? Could you help me?

Thanks for that :)