One question

[LIMPET235]

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

[LIMPET235]

Moving to Firefox Support...

[morat]

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]

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]

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