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
  • #247895

    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:

    <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="">
    <link rel="stylesheet" href="">
    <link rel="stylesheet" href="includes/css.css" type="text/css">
    <link href="" rel="stylesheet" type="text/css">
    <link href=",300,700" rel="stylesheet" type="text/css">
    <script src=""></script>
    <script src="includes/js.js"></script>
    <script src=""></script>
    <script src=""></script>
    <script src="" async defer></script>

    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;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;



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


    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.


    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:

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


    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!


    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').

    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.