The Lodge is members-only design/dev videos and Office Hours.

Next Office Hours Session: "Implementing an SVG Icon System" Nov 30 - 6:00 PM Eastern

CodePen – JS not working in full?

  • # February 26, 2013 at 1:11 pm

    []( “”)

    My function is not defined in full mode.

    I can add the JS to the HTML box and get it working though.

    # February 26, 2013 at 2:13 pm

    Well something happens in Pen mode.

    Could this be a document.ready issue?

    # February 26, 2013 at 4:47 pm

    This reply has been reported for inappropriate content.

    Interesting, apparently codepen wraps the JavaScript in a self-invoking function in full mode, so your function doesn’t get added to global scope.

    (function() {

    function tabs(x){
    x.className += ” active”;

    var tab =;

    case “btn_desc”:

    case “btn_spec”:


    # February 27, 2013 at 7:37 am

    This reply has been reported for inappropriate content.

    Try = function(x) { ... } instead of function tab(x) { ... }

    # February 27, 2013 at 7:42 am

    Thank you this works but `function tab(x)` should work too. I have now submitted the bug anyways.

    # February 27, 2013 at 7:47 am

    This reply has been reported for inappropriate content.

    Already told you why function tab(x) { ... } didn’t work. You’ve submitted it as bug to codepen? I’m curious if they are going to fix that because I think if you had the click listeners in JavaScript instead of inlined with the html (as you should have) it would have worked. Keeping scripting and markup separate. Nevertheless it’s a bug.

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed