Join the AMA (Ask Me Anything) with the Firefox leadership team to celebrate Firefox 20th anniversary and discuss Firefox’s future on Mozilla Connect. Mark your calendar on Thursday, November 14, 18:00 - 20:00 UTC!

This site will have limited functionality while we undergo maintenance to improve your experience. If an article doesn't solve your issue and you want to ask a question, we have our support community waiting to help you at @FirefoxSupport on Twitter and/r/firefox on Reddit.

Avatar for Username

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Mulongo oyo etiyamaki na archive. Tuna motuna mosusu soki osengeli na lisalisi

Javascript slidetoggle does not work

bilkimes
bilkimes
more options

<script> $(document).ready(function(){ 

   $("#flip").click(function(){
       $("#panel").slideToggle("slow");
   });

}); </script>

<style>

  1. panel, #flip { 
   padding: 5px;
   text-align: center;
   background-color: #E7ECEC;
   border: solid 1px #c3c3c3;

}

  1. panel { 
   padding: 50px;
   display: none;

} </style>

This script works perfect on mobile devices, but not on Mac or PC Firefox browser. Example can be seen at http://annunciationcc.org/#announcements. List items should be show collapsed until selected, there are not.

<script> $(document).ready(function(){ $("#flip").click(function(){ $("#panel").slideToggle("slow"); }); }); </script> <style> #panel, #flip { padding: 5px; text-align: center; background-color: #E7ECEC; border: solid 1px #c3c3c3; } #panel { padding: 50px; display: none; } </style> This script works perfect on mobile devices, but not on Mac or PC Firefox browser. Example can be seen at http://annunciationcc.org/#announcements. List items should be show collapsed until selected, there are not.

All Replies (4)

jscher2000 - Support Volunteer
jscher2000 - Support Volunteer
  • Top 25 Contributor
more options

Do you mean you want to see the "3-bar" menu button in the page on desktop as well as mobile? Currently I have to narrow the window considerably for the display to switch. This is going to vary based on zoom levels, but if the window.innerWidth is 981 or less, I get the menu button; if it is 982 or higher, the left column is visible.

jscher2000 - Support Volunteer
jscher2000 - Support Volunteer
  • Top 25 Contributor
more options

Actually, I think you meant something else, but I can't tell.

The Browser Console shows some errors:

GET http://annunciationcc.org/js/modernizr.custom.79639.js [HTTP/1.1 404 Not Found 143ms]

unreachable code after return statement jquery.scrolly.min.js:5:4

GET http://annunciationcc.org/js/modernizr.custom.79639.js [HTTP/1.1 404 Not Found 59ms]

unreachable code after return statement jquery.scrolly.min.js:5:4

TypeError: $nav_a.scrolly(...) is undefined init.js:171:5

TypeError: $(...).accordion is not a function sliding_panels.js:49:1

bilkimes
bilkimes Nkolo motuna
more options

Sorry if my explanation is unclear.

The problem is that I am using webkit which is not supported by Firefox. Seems odd that the code works on iPhone & iPad using Firefox?

Here is the actual code that is not working, sorry I posted the wrong stuff initially. /* Start Here */

summary::-webkit-details-marker { 

	color: #00ACF3;
	font-size: 100%;
	margin-right: 2px;

} summary:focus { outline-style: none; } article > details > summary { font-size: 100%; margin-top: 16px; } details > p { margin-left: 24px; } details details { margin-left: 36px; } details details summary { font-size: 16px; }

  1. back-to-top {

display: none; background-color: #3C3F45; margin: 0; position: fixed; bottom: 0; right: 0; width: 50px; height: 50px; z-index: 99;

-webkit-transition: background 0.1s linear 0s; -moz-transition: background 0.1s linear 0s; -o-transition: background 0.1s linear 0s; transition: background 0.1s linear 0s; }

Ezalaki modifié na bilkimes

jscher2000 - Support Volunteer
jscher2000 - Support Volunteer
  • Top 25 Contributor
more options

bilkimes said

The problem is that I am using webkit which is not supported by Firefox. Seems odd that the code works on iPhone & iPad using Firefox?

On iOS, Firefox is a shell over Safari, which is the most Apple allows. On other platforms, Firefox uses its own rendering engine.

This forum focuses on end-user support; also, its wiki-based syntax does not work well with code snippets, as you can see. For development questions, could I suggest trying one these: