Cyber Week Sale! Get $20 off GP Premium, $40 off our new Lifetime license, and 45% off license renewals/extensions! Learn more

[Resolved] Jquery problems

Home Forums Support Jquery problems

Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #72608
    Bill

    Hi, trying to use a jquery script with this theme. I see that jquery is loaded with the following in the <head> of the page:

    <script type=’text/javascript’ src=’http://mpwrestling.com/wp-includes/js/jquery/jquery.js?ver=1.11.1′></script&gt;

    Here is the script I’m trying to run:

    $(document).ready(function() {

    var w = $(window);
    var masthead = $(‘#site-navigation’);
    var adminbar = $(‘#wpadminbar’);

    var a = adminbar.height();

    var o = adminbar.length > 0 ? a : 0;
    var h = $(‘.site-branding’).height();
    var m = masthead.offset().top;

    w.scroll(function() {

    var st = w.scrollTop();

    if(st > h)
    {
    masthead.css({‘position’ : ‘fixed’, ‘top’ : o})
    }
    else
    {
    masthead.css({‘position’ : ‘absolute’, ‘top’ : 0})
    }

    })

    });

    Basically, it’s a script to fix the gray bar to the top of the page as it scrolls there. It’s a script I’ve run on several other websites successfully. However, I get “Uncaught TypeError: undefined is not a function” in the console when it’s run. It’s acting like jquery’s not there.

    So I tried to insert a link to a “fresh” jquery library. My script works fine now; however, the nav menu dropdowns freeze after I mouse over a menu item.

    Anyone else have this problem?

    #72621
    Tom
    Lead Developer
    Lead Developer

    In order for jQuery to work with WordPress, you need to change your very first line from:

    $(document).ready(function() {

    to:

    jQuery(document).ready(function($) {

    WordPress needs you to specify that you’re using jQuery, as it supports multiple other libraries as well.

    Let me know if that fixes it 🙂

    #72631
    Bill

    That did it. Thanks!

    #72644
    Tom
    Lead Developer
    Lead Developer
    #105278
    Thomas Furmato

    Where is this first line?

    #105279
    Thomas Furmato

    I’m using layerslider and the contents are not showing in the container.

    #105327
    Tom
    Lead Developer
    Lead Developer

    The above was for writing his own jQuery.

    Can you link me to your site where layerslider isn’t working?

    Thanks!

    #105362
    Thomas Furmato
    #105379
    Tom
    Lead Developer
    Lead Developer

    Hmm, looking like more of a layer slider issue.

    Is the text you’re wanting to show up called “Home Automation”?

    If so, is it supposed to be an image, or text? Right now, it’s set to be an image, but there’s no image URL, so it’s using the alt tag of the image (Home Automation).

    #105398
    Thomas Furmato

    Yes. I’ll drag it into their forum then. Thank you for your help on this.

    #105399
    Tom
    Lead Developer
    Lead Developer

    No worries. Let me know if there’s anything I can do 🙂

    #105421
    Thomas Furmato

    Well, since you asked….

    I’d like to turn the top menu bar into a responsive block, that holds only phone # and address. It would need two divs I guess, so that when the site is shrunk the phone # is on top of the address. ( I currently disabled the top menu bar )

    The reason being is I don’t want them to disappear when in mobile, and the don’t have to be a nav menu.

    #105496
    Tom
    Lead Developer
    Lead Developer

    You could add something like this into GP Hooks (Above Header):

    <div class="grid-container grid-parent">
          <div class="grid-50">
                Phone number
          </div>
          <div class="grid-50">
                Address
          </div>
    </div>

    The above will show the phone number on the left, and address on the right. Then, on mobile, the phone will be above the address.

    Let me know if that helps or not 🙂

Viewing 13 posts - 1 through 13 (of 13 total)
  • You must be logged in to reply to this topic.