Grow your CSS skills. Land your dream job.

jquery not working in project

  • # December 22, 2012 at 1:02 pm

    Hi folks,
    I have a very rough expand function here through jquery that works in codepend, however I’m having trouble getting it to work in my project. I’m using codekit with an normal setup of index.html, css.scss, script.js. Codekit is recognizing the file, but chrome inspector is showing a red arrow on the 3rd row… with
    “Uncaught TypeError: Cannot set property ‘scrollTop’ of null”

    http://codepen.io/joe/full/rmeat

    Any help is appreciated.

    # December 22, 2012 at 3:25 pm

    @wragen22

    Edit: This may be a stupid question but some usually forget, are you calling jQuery in your page?

    # December 22, 2012 at 3:56 pm

    yes, buddy of mine we’re exploring some designs. Yes jquery is being called.

    # December 22, 2012 at 4:15 pm

    @wragen22 I can’t seem to replicate the issue. Are there other jQuery scripts that could be conflicting with this?

    # December 22, 2012 at 4:21 pm

    Hmm.. none others. Perhaps i’m calling it wrong?

    Have this in my header

    # December 22, 2012 at 4:40 pm

    @wragen22 create a new pen on codepen so I can see what you’re talking about.

    I noticed that when I add the jquery in the head section, it doesn’t work but if I add it just before the closing body tag, it does.

    # December 22, 2012 at 5:02 pm

    http://codepen.io/joe/full/rmeat

    # December 22, 2012 at 5:12 pm

    @wraggen22, No I mean post the exact code you have in your html page (you can remove the links so no one knows the URL). It doesn’t matter if it renders or not, I just want to see how you have it structured.

    # December 22, 2012 at 5:18 pm

    Interesting… posted my html i have in my project to the codpen and js is not rendering.

    Here is the updated codepen.

    http://codepen.io/wragen22/full/sqrlD

    # December 22, 2012 at 5:23 pm

    @wragen22 That’s how CodePen works. You only paste your content that’s inside the body element. But I needed that to see how you’re doing things.

    Try removing this from your head section and placing it right before you closing body tag (< /body >).


    # December 22, 2012 at 5:51 pm

    That works! … now why would that be the case?

    # December 22, 2012 at 5:53 pm

    @wragen22 I think it has to do with the way it loads the page. I hope this solved your issue. If not, we can troubleshoot further.

    # December 22, 2012 at 6:03 pm

    It did. Might you be able to recommend a cleaner type of js expand though? Not really liking how the text slides in from the left as the panel expands.

    # December 22, 2012 at 6:22 pm

    As in an accordion style expand? http://jqueryui.com/accordion/

    # December 22, 2012 at 7:02 pm

    hmmm…for some reason the current js I have when clicking to close – the background color disappears then slides up.

    I’m trying to get to a model like this here. Where you click – expands nicely and closes when others are clicked.

    http://www.mdlwebsolutions.com/blog/milo-lamar/jquery-animated-sliding-or-fading-hidden-elements

Viewing 15 posts - 1 through 15 (of 18 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".