MozillaZine


One question

User Help for Mozilla Firefox
Ronas
 
Posts: 4
Joined: April 4th, 2019, 7:53 am

Post Posted August 16th, 2020, 10:40 pm

Hello

I want the following code to work with a 3 second delay in displaying Bookmarks Toolbar.


Code: Select all
#PersonalToolbar {
    visibility: collapse !important;
}

toolbarspring:hover > #PersonalToolbar {
    visibility: visible !important;
}



Also, is there a way for this code to work only when the mouse pointer hovers over the points highlighted in the image below? (To display Bookmarks Toolbar)

> http://uupload.ir/files/gl9g_1.jpg
Last edited by LIMPET235 on August 17th, 2020, 6:25 am, edited 1 time in total.
Reason: Image tags removed to restore the forum layout.

LIMPET235
Moderator

User avatar
 
Posts: 39375
Joined: October 19th, 2007, 1:53 am
Location: The South Coast of N.S.W. Oz.

Post Posted August 17th, 2020, 6:26 am

Moving to Firefox Support...
Ancient Amateur Astronomer
Win-7-HP/IntelĀ® DualCore-2.0GHz/500G HDD/4 Gig Ram/550Watt PSU/350WattUPS/Firefox-20.0-62.0-70.0/T-bird-2.0.0.24/SnagIt-v10.0.1/MWP-7.12.
W.M.Y.C.
(Always choose the "Custom" Install.)

morat
 
Posts: 4267
Joined: February 3rd, 2009, 6:29 pm

Post Posted August 18th, 2020, 8:45 am

Your css isn't valid since the #PersonalToolbar element is not a direct child of the toolbarspring element.

Reference
http://developer.mozilla.org/docs/Web/CSS/Reference#Selectors
http://developer.mozilla.org/docs/Web/CSS/Child_combinator

Try this:

Code: Select all
/* Firefox userChrome.css */

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

#PersonalToolbar:not([customizing]) {
  visibility: collapse !important;
  opacity: 0 !important;
  transition: visibility 3s linear, opacity 3s linear !important;
}

#navigator-toolbox:hover > #PersonalToolbar {
  visibility: visible !important;
  opacity: 1 !important;
  transition: visibility 3s linear, opacity 3s linear !important;
}

http://kb.mozillazine.org/UserChrome.css

Reference
http://developer.mozilla.org/docs/Web/CSS/transition

Ronas
 
Posts: 4
Joined: April 4th, 2019, 7:53 am

Post Posted August 18th, 2020, 6:50 pm

morat wrote:Your css isn't valid since the #PersonalToolbar element is not a direct child of the toolbarspring element.

Reference
http://developer.mozilla.org/docs/Web/CSS/Reference#Selectors
http://developer.mozilla.org/docs/Web/CSS/Child_combinator

Try this:

Code: Select all
/* Firefox userChrome.css */

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

#PersonalToolbar:not([customizing]) {
  visibility: collapse !important;
  opacity: 0 !important;
  transition: visibility 3s linear, opacity 3s linear !important;
}

#navigator-toolbox:hover > #PersonalToolbar {
  visibility: visible !important;
  opacity: 1 !important;
  transition: visibility 3s linear, opacity 3s linear !important;
}

http://kb.mozillazine.org/UserChrome.css

Reference
http://developer.mozilla.org/docs/Web/CSS/transition



Thank you very much

Is it possible to make this feature using userchrome.css in Firefox?

Please see the clip below:

https://drive.google.com/file/d/1zL5mpPc5dQui-H_kX9fOthVyrTEBqU-2/view?usp=sharing

morat
 
Posts: 4267
Joined: February 3rd, 2009, 6:29 pm

Post Posted August 19th, 2020, 7:14 am

You can't do that with a userchrome.css tweak.

Return to Firefox Support


Who is online

Users browsing this forum: No registered users and 9 guests