Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Peter Alcock 113 posts 176 karma points
    May 09, 2013 @ 12:17
    Peter Alcock
    0

    Javascript ToggleTabs not working in Firefox

    Hi all,

    Hoping for some help! I have a site setup with a search on the homepage which has a toggle setup to show & hide the search using the below javascript, this is working great in Chrome, IE but not in Firefox and not sure why?

    Anyone have any ideas?

    Thanks

    Pete

    <input type="button" value="Open Search" class="villaformopen"/>
    <input type="button" value="Close Search" class="villaformclose"/>

    <div class="homesearch" id="homesearch">
     <umbraco:Macro Alias="SearchFormHorizontal" runat="server"></umbraco:Macro
    </div>

    <script type="text/javascript">
    function toggleTabs(){$("#homesearch").toggle();$("#villaformopen").toggle();$("#villaformclose").toggle();}
    $(".villaformopen").click(function(){toggleTabs();});
    $(".villaformclose").click(function(){toggleTabs();});
    </script>

  • Jan Skovgaard 11280 posts 23678 karma points MVP 11x admin c-trib
    May 09, 2013 @ 12:22
    Jan Skovgaard
    1

    Hi Peter

    Do you get any error message in the browser consoles in Firefox or Internet Explorer?

    /Jan

  • Peter Alcock 113 posts 176 karma points
    May 09, 2013 @ 12:25
    Peter Alcock
    0

    Hi Jan,

    The only JS error thats appears is --

    [11:24:10.771] Use of attributes' specified attribute is deprecated. It always returns true. @ https://apis.google.com/js/plusone.js:21

    But that's nothing to do with the toggletabs

    Thanks

  • Jan Skovgaard 11280 posts 23678 karma points MVP 11x admin c-trib
    May 09, 2013 @ 12:25
    Jan Skovgaard
    1

    ...Besides I think you should be able to complete your goal by just toggling the input field when one button is clicked like shown in this example.

    http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_eff_toggle_speed

    Hope this helps.

    /Jan

  • Peter Alcock 113 posts 176 karma points
    May 09, 2013 @ 12:39
    Peter Alcock
    0

    Does seem an odd issue, ive just tried that version and get the same problem not working in Firefox, whats even stranger is that the example on the w3schools site works in Firefox??

    The site im working on is http://lanzarote.i-pro2.co.uk/

    Thanks

  • Jan Skovgaard 11280 posts 23678 karma points MVP 11x admin c-trib
    May 09, 2013 @ 13:42
    Jan Skovgaard
    0

    Hi Peter

    Where can I see the toggle stuff?

    Just checked your source and you include jquery in the head section. In general it's better to place javascript before the </body> to optimize load time of the website since javascript can block loading of other assets, which need to be in order before it can be executed.

    Perhaps you could also try to update to jquery 1.9.1 and see what happens.

    /Jan

  • Peter Alcock 113 posts 176 karma points
    May 09, 2013 @ 14:18
    Peter Alcock
    0

    Hi Jan,

    The toggle parts are about half way down the source you will see div class homesearch which is the box that needs to open/close and the buttons are just above.

    I tried referencing 1.9.1 but didnt make any difference so took it back out as my js are minimized for performance, i know what you mean about loading the js in the right place i just plonked it on to try and get it working heh heh.

    Thanks

    Pete

  • Jan Skovgaard 11280 posts 23678 karma points MVP 11x admin c-trib
    May 09, 2013 @ 14:40
    Jan Skovgaard
    0

    Hi Pete

    So what is supposed to happen when I click the "more" link?

    Should it then display the form at the top? I'm not sure it's working in my version of Chrome since the search bar is present when I'm loading the page.

    /Jan

  • Peter Alcock 113 posts 176 karma points
    May 09, 2013 @ 16:01
    Peter Alcock
    0

    Hi Jan,

    When you load the page its the 'Check availability & search' which is the search form, above and to the right is the 'opne/close' button which shows then hides the form when clicked.

    Thanks

    Pete

  • Jan Skovgaard 11280 posts 23678 karma points MVP 11x admin c-trib
    May 09, 2013 @ 16:11
    Jan Skovgaard
    0

    Hi Peter

    Sorry for being blind :)

    I just tested in Firefox and it actually works...however I think it's because I'm trying while the console window is open.

    Could you try to uncomment every console.log() you have in your code and then test again? This could be the issue.

    /Jan

Please Sign in or register to post replies

Write your reply to:

Draft