Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript Javascript working in jFiddle but not project! :(

  • This topic is empty.
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #247895
    cscodismith
    Participant

    I am trying to incorporate a minimize function so everything within a <div> with the id content will close on button click. It seems to be working great here on the JSFiddle but when I try to incorporate in my project, there is no reaction when clicking the button :(

    Here is what my <head>looks like:

    <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="google-signin-client_id" content="618381226281-f3ht6d47jl818rjmr0p3rh3idftoaka7.apps.googleusercontent.com">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
    <link rel="stylesheet" href="includes/css.css" type="text/css">
    <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet" type="text/css">
    <link href="https://fonts.googleapis.com/css?family=Oxygen:400,300,700" rel="stylesheet" type="text/css">
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script src="includes/js.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
    <script src="https://www.google.com/recaptcha/api.js"></script>
    <script src="https://apis.google.com/js/platform.js" async defer></script>
    <title>'.$title.'</title>
    </head>

    and here is what my button and div#content looks like:

    `<input type=”button” id=”hideshow” value=”show/hide” />

            &lt;div id="content"&gt;
    
            &lt;!-- heading here --&gt;
            &lt;h3&gt;Admin Level 1 Panel&lt;/h3&gt;
            &lt;p&gt;Use this module to create new posts&lt;/p&gt;
    
            &lt;form method="post" enctype="multipart/form-data" class="admin_module"&gt;
    
             &lt;input class="input2" type="text" name="title" placeholder="Headline" required /&gt;&lt;br /&gt;
             &lt;input class="input2" type="text" name="date" value="' .$current_date. '" readonly /&gt;&lt;br /&gt;
             &lt;input class="input2" type="text" name="author" value="' .$author. '" readonly /&gt;&lt;br /&gt;
    
             &lt;div class="input2"&gt;
               &lt;p&gt;Select image to upload:&lt;/p&gt;
               &lt;input style="padding:3px;" type="file" name="image" id="image" /&gt;
             &lt;/div&gt;
    
             &lt;textarea class="ta-summary input2" type="text" name="summary" placeholder="Summary" required&gt;&lt;/textarea&gt;&lt;br /&gt;
             &lt;button class="input2 btn btn-default" type="submit" name="submit"&gt;Submit Post&lt;/button&gt;
    
           &lt;/form&gt;
    
           &lt;/div&gt;
    

    `

    #247897
    Shikkediel
    Participant

    A link to the non-working example might be more useful then… why use such an old version of the library by the way?

    #247898
    cscodismith
    Participant

    When I clicked the JSFiddle link it seems to work fine though? also I used an old version as that is the one from another post I seen regarding this.

    #247900
    Shikkediel
    Participant

    If you use a newer version, you’ll have many more handy methods at your disposal later on. All it really needs is to not use live (deprecated). I think toggle('show') is a typo by the way, it should probably be 'slow'. Which I think any invalid string (accepted are slow and fast) defaults to:

    http://jsfiddle.net/h24twj82/

    Still, hard to say why it wouldn’t work on your page without actually seeing it…

    #247902
    cscodismith
    Participant

    Thanks a lot! Seems it was the outdated version of jQuery and the weird toggle('show') – switching that to toggle('bubblebath') as you had in the JSFiddle you linked worked!

    #247903
    Shikkediel
    Participant

    You sure it’s not because I left out the .live listener then? Best to change bubblebath to slow, it was just to demonstrate that any random (invalid) word would have the same effect – defaulting to toggle('slow'). Even toggle('') should actually work. You could also put in any number to define the duration. Currently it’s 600ms ('slow').

    http://jsfiddle.net/s3mbx6kg/

    Edit – I wrote that live was deprecated but it’s actually been removed since jQuery 1.9. So it’ll break any newer version…

Viewing 6 posts - 1 through 6 (of 6 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.