On 31/1/08 12:26, Joel Birch [EMAIL PROTECTED] wrote:
Hi Dave,
Instead of display:none and display:block to hide and reveal your
submenus you need to use top:-999em and top:1.5em (or whatever the
vertical offset you need for your menu) respectively. The only other
thing you need to
Hi Karl,
Once again you have come through with the goods! I blindly pasted in
your code (all these dimension calculations fry my brain) and it's
working perfectly with regard to positioning. All hail King Karl
[...we're not worthy...]
All we (Jesse and I, that is - I'm not hinting for Karl to
Hmmm, a fix? I think of it as a feature actually, as the links have
more chance of remaining accessible to screen-readers and the like if
you don't use display:none. Untested by me, but it's a common theory.
You could try attaching your display:none/display:block to the onHide
and onBeforeShow
Doh, just as I clicked send I realised you wanted the solution for
when JS was *not* available. I guess you could use
display:none/display:block in your CSS along side the necessary 'top'
values, and then use the callbacks as shown above, but with opposite
effects. This way, when JS is available,
On Jan 31, 2008, at 8:50 PM, Joel Birch wrote:
Hi Karl,
Once again you have come through with the goods! I blindly pasted in
your code (all these dimension calculations fry my brain) and it's
working perfectly with regard to positioning. All hail King Karl
[...we're not worthy...]
LOL. You
Karl,
I'm honoured that you are getting some use out of Superfish.
I didn't want to give you more work so I just gave the horizontal
stuff a shot and I can't get it right. I just can't get my head around
all these similar sounding measurements! Would you be so kind...? O:)
Here's where I got
Hi Joel,
I'll try to give you some feedback.
First some remarks and questions and then a bug report :
You may change some filenames. For instance helperPlugin.js to
hoverIntent.js or vertical.css to superfish-vertical.css
I think it would be nice to put an exemple menu at the top of the
On 31/01/2008, Olivier Percebois-Garve [EMAIL PROTECTED] wrote:
Hi Joel,
I'll try to give you some feedback.
Hi Olivier,
Thanks very much for the feedback, it really is very useful.
First some remarks and questions and then a bug report :
You may change some filenames. For instance
Thanks a lot, it's working just fine.
Thanks for your time Charles, I didn't expect so much information and
I will definitely use your technics to debug, it make so much sense (I
should have think about it!!!)
On Jan 28, 11:47 am, Charles K. Clarkson [EMAIL PROTECTED]
wrote:
eugene33 wrote:
Hi there,
I set up a test page and got the menu working in IE. Here are some
things I changed:
1) removed width:100% from menu.css as shown below. That was making IE
stretch the link to full width meaning that they no longer floated
together horizontally:
.nav ul li,
.nav a {
width:
Hi there,
What have you tried debugging-wise? The CSS looks right so I'm
thinking there could be a few things to check next. Does the menu work
when you remove the IE7-js code? If so then there must be a conflict
of some sort that we can look into.
The next thing is that I notice your HTML does
eugene33 wrote:
: I have a little problem with superfish and IE7 (probably IE6 too
: couldn't test it)
It fails under IE6 as well.
The problem seems to be the relative positioning of the #content.
The default is static positioning works fine. The relative position is
causing the
Hi Charles,
Great post - thanks very much for doing all of that debugging and
writing such an informative response. I didn't have chance to set up
test pages for this at the moment and now I may not need to. :)
I should have thought of this as it has come up a few times... the
cause of the
Well, unfortunatly we only have it up on an interanl site for testing
right now, but I'll move some stuff around, and let you know when its
up.
Thanks again
BFTech
Hi BFTech,
We are going to need to see your page in order to help you with this.
Can you post a link please?
Joel Birch.
Okay, embarrassment time. I found a bug: the submenus close after
mouseout even if you hover back onto them before the delay expires. My
excuse: tiredness. I'll fix this within 24 hours (after some sleep).
Until then I'll degrade back to Superfish v1.4.
Apologies.
Joel Birch.
Fixed.
Joel BIrch
no prob.. you've made a great menu... thank YOU sir
On Jan 17, 6:03 pm, Joel Birch [EMAIL PROTECTED] wrote:
Hi Brian,
Thanks so much for pointing that out. The horizontal menus were indeed
not working and throwing an error. I have fixed it now. Please let me
know if you still experience any
Hi Brian,
Thanks so much for pointing that out. The horizontal menus were indeed
not working and throwing an error. I have fixed it now. Please let me
know if you still experience any issues.
Thanks again
Joel Birch.
Hi Alex
Have you tried just having the script for Hover Intent below superfish
in your source code. That way superfish wont have access to
hoverintent due to it not being loaded prior to superfish being read
by the browser.
Cheers
Stephen
Hi Alex,
Usually hoverIntent improves how Superfish works as the very slight
lag means that submenus are not flickering open unnecessarily, so I
assume you may have altered the settings so that the delay is longer
for use with Cluetip. To hack Superfish, change the
applySuperfishHovers function
Thanks Stephen, that's a much better idea!
Joel Birch.
On 16/01/2008, Joel Birch [EMAIL PROTECTED] wrote:
Thanks Stephen, that's a much better idea!
Joel Birch.
...Although I should mention that this won't work with the *next*
version of Superfish (v1.4) as it detects hoverIntent regardless of
where it appears in the source order. Instead, there
Hi Jesse,
I have been working on separating out the code you provided into it's
own plugin (kind of sillily named Supposition, I really hate the
name now so please feel free to suggest something better) so that it
can be optionally added to a Superfish menu if the user desires,
leaving the
Hi Joel,
Thanks for your response. This is indeed a wierd one! In fact, my
code is already doing what you suggest... the absolute path was
expanded by php from Wordpress's bloginfo - I was showing you the code
I saved from the page, not my original source code which already uses
bloginfo.
I'm
Well, I fixed it by doing an ugly hack - but it works.
The trick was to use an absolute path on the local machine (a path
that starts with / instead of http://;). Unfortunately it means
that my pathname is very long and if I ever move things around I'll
have to remember to update that. It
Hi Joel - I am still trying to find a solution to this problem. I
just realize that in my previous post, I gave the wrong URL for the
result of the change that I made... Check this:
http://news1.pandesa.com/wp-content/themes/zenful_pandesa/test1.htm
At the above URL, the menus are working
It sounds like you need to set a width on the submenu's container ul.
Because those menu items are floating, they will appear horizontally
unless constrained by their parent's width.
Regarding the flash issue, I've seen many people happy with one or
another of the solutions, but if I remember
This used to be possible by targetting a li element and running
hideSuperfishUl() on it:
$('#nav li.sfHover').hideSuperfishUl();
...but since I had to make changes to allow multiple menus on a page
have separate options, this doesn't work because hideSuperfishUl() now
takes the options object
You're right, this is the quirk I'm talking about.
I'm on Windows myself, so I have been referring to Windows Firefox.
I'm still puzzled by this :| I hope we (or someone else) will be able to
work this out.
I might be misunderstanding, but the arrows in the example link are not done
with javascript - it's just css (from the linked page):
#menuh a.top_parent, #menuh a.top_parent:hover /* attaches down-arrow to
all top-parents */
{
background-image: url(navdown_white.gif);
This isn't Superfish specifically, though I did write it based very
largely on the original Suckerfish, with enhancements.
http://beta.ksscholl.com/jquery/suckerfish.html
Kevin
On Jan 7, 5:04 pm, Robin Rowell [EMAIL PROTECTED] wrote:
Hi all and Joel.
Is there a version of Superfish that
Hi Robin,
You can always control the Sub Level arrows by a new CSS class. You
can get the extra class into your nav via jQuery without needing to
edit Joels script, by just adding...
$(document).ready(function(){
// normal Superfish Call
$(ul.nav).superfish({
hoverClass: sfHover,
And a little update, as it seems to work great now (tested in IE6, IE7
and FF2):
http://www.klaasse.net/superfish-ext/superfish.html
I'm not totally satisfied yet, because:
- I'm using + 1 in my calculations to include border/margin/padding
stuff in the width() and height() results;
- There's
This issue has something to do with the animation. When I replace the
animation with a simple show() method, there's no pixel shift anymore..
* There's some strange submenu text pixel-shift (FF only) and
right border redrawing (both IE and FF) going on, which I can't explain.
However, this
Hi Jesse,
Sorry I have been unresponsive - I've been too busy with work etc.
which is unfortunate because I think what you have done here is
fantastic. I wish I had more time now to discuss this new feature
indepth but, alas, I have to race off to work again :/
Regarding the border redrawing,
Oh, and the pixel-shift problem in FF is most likely the now fairly
well documented opacity triggered text-mode quirk of that browser (on
Mac at least). I wouldn't worry about that - it will always occur
whenever any on-screen element's opacity switches between 1 and .
or .01 and 0 - as
One more thing I just thought of. Regarding finding a more robust
solution for the width() and height() offsets, this value will always
depend on the CSS the designer uses for the menu so I think the lesser
evil here would be to add some offset options to the options object
so you can pass in
Hi Jesse,
I'm at work, but I did a search for an explanation of the Mac Firefox
text flicker issue that I posted previously. Here it is:
Mac Firefox has two text rendering anti-aliasing modes, one of which
makes the text look much lighter or less bold in weight. The usual
mode is used when
It just dawned on me that you probably were not referring to the Mac
FF text mode shift caused by opacity changes. I see now that the menu
item text shifts upward one pixel once the fadein animation has
completed. When using the default font (Georgia or maybe Times on the
computer I'm currently
I have written some test code, which does what it's meant to do, but I
think it isn't in the right place..
I have added this code to the default options block of superfish.js:
autofitX: true,
autofitY: true,
And this code instead of the original showSuperfishUl part:
Nevermind. the problem has been solved. I had been using the sfhover
extension on all my pages, and I should've only used them on the pages
with flash objects. Should be working great now. but if anyone sees
otherwise, I'd appreciate a head's up!
Happy new Year!
On Dec 31, 1:09 pm,
I think I found the problem, but I'm not sure how to fix it...
I used View - Page Source and pasted it into a file at the
following location:
http://news1.pandesa.com/wp-content/themes/zenful_pandesa/test.htm
As you can see, the menus are still slow and clunky.
Then I replaced the following
I think I found the problem, but I'm not sure how to fix it...
I used View - Page Source and pasted it into a file at the
following location:
http://news1.pandesa.com/wp-content/themes/zenful_pandesa/test.htm
As you can see, the menus are still slow and clunky.
Then I replaced the following
The HTML is created from your PHP files on the server, but by the time
the browser sees it it will just be regular static HTML, so you you
can just copy and paste from View Source and save it as a HTML file.
If you can do that then the file should just run from the file system
(ie. without a
Hi Joel,
Thanks for your prompt response! The page is validating now, but we
still have the same problem.
You've asked for the HTML, CSS and JS, but this is a WordPress page,
so the HTML is created from a bunch of PHP files.
Do you want me to package-up the WordPress template and send it to
Hi John, long time no talk :)
The dodgy behaviour on that page is very strange. Makes me think it
could be due to HTML errors. I think if you can make the code validate
we can rule out lots of possibilities and if it still doesn't work,
package up that page's HTML, CSS and JS and send that test
Hi Ibrahim,
Have a read of this page:
http://users.tpg.com.au/j_birch/plugins/superfish/all-horizontal-example/
and see if the pathClass option is what you are looking for.
Joel Birch.
I guess this question is similar to your other question, except that
in this case it does sound like pathClass may help. See this page for
info:
http://users.tpg.com.au/j_birch/plugins/superfish/all-horizontal-example/
Joel Birch.
My attempts to do a fade out ran into various bugs that I couldn't
resolve, so nope, no fade outs. That said, the animation engine of
jQuery has been completely overhauled since I first created Superfish,
so maybe I will have another crack at this at some stage.
Thanks for your kind words. I'm
On 11/12/2007, Robert [EMAIL PROTECTED] wrote:
I have a problem with Superfish in FF2.0. It seems that all list items
are set in line. I have not a clue where this is coming from. In IE
everything works oke. Does someone know an answer to this problem?
see: vinkbouw.whooozwebmedia.nl for
It worked. Thanks!
Jennifer
On Nov 30, 2:51 pm, Joel Birch [EMAIL PROTECTED] wrote:
Hi Jennifer,
Maybe try wrapping a span tag (with a class... say arrow) around the
arrow character and do:
.arrow {
position: absolute;
right: .5em;
top: .5em;
}
...or something like that.
Thanks Joel!
I could've sworn I'd changed that in the javascript file, but
apparently not.
Thanks for taking the time to help all of us helpless javascript
rookies. We really appreciate it. Very few people would have the
patience for it, so thanks again!
Just out of curiousity, is there a
Hello,
The hover class needs to be sfHover with an uppercase H. This bites
people occasionally which is why I added it to the Troubleshooting
section of the Superfish docs. Hopefully if you fix that your menu
will work, let us know if not.
Alternatively, if you prefer to use your current
Hi Jennifer,
Maybe try wrapping a span tag (with a class... say arrow) around the
arrow character and do:
.arrow {
position: absolute;
right: .5em;
top: .5em;
}
...or something like that.
Joel Birch.
Thanks for the suggestions, I'll give them a try!
--Beau
On Nov 28, 5:14 pm, cromeis [EMAIL PROTECTED] wrote:
Anyway, I've got the menus working the way I want in Firefox, but
can't get them to work quite as well in IE 6 7. The two problems
I'm facing in IE 6/7 is that the third level
Hello Joel,
Thanks for your reply and your quick fix, everything works like a
charm now! :)
Regards Arjan
On Nov 23, 2007 3:27 AM, Joel Birch [EMAIL PROTECTED] wrote:
On 23/11/2007, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote:
I tried giving them different IDs and testing the same approach with
.nav li #id with no success, the selector doesn't work.
Not sure exactly where the problem lies, but
Oh, haha. And I was trying to be all cool by deleting the changelog.
Thanks for the headsup.
Jennifer
On Nov 21, 10:22 pm, Joel Birch [EMAIL PROTECTED] wrote:
Hi Jenny,
It looks like you deleted the change log from the Superfish JS file
(which is good) but left the remaining comment
On 23/11/2007, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote:
I tried giving them different IDs and testing the same approach with
.nav li #id with no success, the selector doesn't work.
Not sure exactly where the problem lies, but that selector should
probably be .nav li#id or just .nav #id and
It worked! I can't thank you enough for your help Joel! You totally
made my day! And thank you Jared for your feedback as well.
On 22/11/2007, cromeis [EMAIL PROTECTED] wrote:
It worked! I can't thank you enough for your help Joel! You totally
made my day! And thank you Jared for your feedback as well.
Great! With responses like that, you will always be most welcome ;)
Joel Birch.
Hi Jenny,
It looks like you deleted the change log from the Superfish JS file
(which is good) but left the remaining comment unclosed as it is
missing a forward slash after the last asterisk. Make the start of
that file look like this:
/*
* Superfish v1.3.2 - jQuery menu widget
*
* Copyright
Just wondering why when I post the forum software doesn't seem to
notice it's a *new* post...
On Nov 19, 8:57 pm, Jared [EMAIL PROTECTED] wrote:
Here's another guy, so I guess I'm not alone. Interface andSuperfish
don't play well together, looksit.
Er, WOW! Talk about going the extra mile - thanks Joel!!!
I'm under pressure to get the site finished but once it's done, I'll
have a look at the changes you've made so I can learn something from
them.
On Nov 17, 7:13 am, Joel Birch [EMAIL PROTECTED] wrote:
I had a look at your page and it
Hi Joel,
Thank you so much for your css suggestion and for explaining your
choice of a class vs. an id.
Unfortunately the css suggestion did not correct the issue. I updated
the css with the following code:
#nav li:hover, #nav li.sfHover,
#nav li:hover a, #nav li:sfHover a,
#nav a:hover, #nav
On 21/11/2007, cromeis [EMAIL PROTECTED] wrote:
#nav li:hover, #nav li.sfHover,
#nav li:hover a, #nav li:sfHover a,
#nav a:hover, #nav li a:hover,
#nav a:focus, #nav a:active {
color:#51749F;
background:#ff;
text-decoration:line-through;
}
Oh sorry, I
I don't know if this helps, but I preferred to make the entire
latticework ul/li apparatus transparent (background/border: none) and
use margin/padding/background/border for a container div, and I
thought it worked pretty good.
My problem now is that I need to leave breadcrumbs for highlight, so
Hi Joel,
Well, I have found the source of the problem (which isn't superfish
per se). If I un-include the jQuery plugin interface, the entire
menu works as it should.
Here's a link to the problem in action:
http://web3.unt.edu/riskman/Test/testcases/superfishnav/UNT_RMS-EMP-application.html
Hi Joel,
many thanks. Everythings perfect now!
Keep up the good work, Hannes
p.s. I love the plugin.
On 17/11/2007, slooodge [EMAIL PROTECTED] wrote:
Unfotunately the declaration of the first
animation type gets overwritten by the second one.
Does anyone know how to implement two different menues on one page?
Hi Slooodge!
Thanks very much for pointing this out. The first version of
Hi Arjan,
Thanks for the bug report - I found that it happens in both IE6 and
IE7. This was such a bizarre thing - I still have no idea why or even
how it possibly could occur, but I seem to have found an ugly but
effective fix for it which I have added to the latest version of
Superfish (now
Hi Jared,
I have not been able to reproduce this problem at all so it's hard to
give any decent advice. The thread you linked to shows that Noobert's
problem was resolved and his issue turned out to be other CSS on the
page interfering with the menu.
Quote from that thread:
Aha! I found the
I had a look at your page and it seems that you just need to adjust
your widths and padding of all the elements involved. I altered the
css from within Firebug to what I think is a more robust set of
values. The resulting css should be more stable across all browsers.
I've posted the resulting
Hi Carleigh,
Sorry for the delay in replying - I've been really busy.
This should solve it I think. In the css rule with the selector:
#nav li:hover, #nav li.sfHover, #nav a:focus, #nav a:hover, #nav
a:active { ... }
you need to have this selector also: #nav li:hover a, #nav li:sfHover a
I
Can I just clarify what you've said?
You mean, explicitly define the width of the navigation div and then
make sure that width plus padding equals the first ul element?
There are a couple of issues with width that may all be related
actually.
If you take a look at this page:
I don't have an easy answer for you, but it seems like you've tried a couple
different techniques and haven't completely removed the old ones. For
example, you've got both the original suckerfish javascript (sfhover) and
superfish ( which is a jquery implementation of the suckerfish menu).
Hi rolfsf,
Thanks for your response.
I have re-checked all the code against a working example and the only
difference appears to be the way in which the flash file is embedded.
It works for this code:
object classid=clsid:D27CDB6E-AE6D-11cf-96B8-44455354
Hi, it works because you used the :
param name=WMode
value=Transparent
wmode=transparent
You need this for elements to appear above the flash movie.
-Tony
gracetec wrote:
Hi rolfsf,
Thanks for your response.
I have re-checked all the code against a working example and the only
You definitely need to include bgiframe, because without you have errors,
and therefore the swfobject code cannot run.
gracetec wrote:
Hi rolfsf,
Thanks for your response.
I have re-checked all the code against a working example and the only
difference appears to be the way in which the flash
Hey Joel,
Thank you so much! I can't believe I forgot something that simple.
After putting that in, the menu now works perfectly across all browser
platforms. Again, thank you so much for your help!
Ryan Ours
On 03/11/2007, Olivier Percebois-Garve [EMAIL PROTECTED] wrote:
You definitely need to include bgiframe, because without you have errors,
and therefore the swfobject code cannot run.
...or remove the code that applies bgiframe to Superfish completely,
and don't include the bgiframe plugin. It
Hi Ryan,
You didn't initialise your menu. Put this in a script tag after
including Superfish:
$(document).ready(function(){
$('ul.nav').superfish();
});
Of course you can also pass in an options object if you wish. Check
out the Superfish documentation for more info.
Hi George,
Sorry for the lack of response recently.
I think you should look into including the hoverIntent plugin to solve
this issue. If you include it in the source order before the Superfish
plugin it will be used automatically and prevent menus from opening
from a cursor merely passing over
Well, I found the issue this morning. Turned out it was a CSS issue
with how I placed the sfHover class.
I'll leave the URL active for a little while in case anyone else runs
into the same issue. Please be aware, the CSS is pretty heavy, but
that's what you get when there's a team of designers
Thanks for your reply but unfortunately on PC IE the menu still jumps
around
http://elearningrd.info/portal/test3.php
even though I specified a width for the nav element. Any other ideas?
Thanks, - Dave
On Oct 18, 11:14 pm, Joel Birch [EMAIL PROTECTED] wrote:
Hi Dave,
Simply apply
Hi Dave,
Simply apply width:100px (or whatever value) to the .nav element.
Joel Birch
P.S. sorry to everyone who have posted Superfish help requests lately
- I've been so busy and have not had chance to look help out as much
as usual. Hopefully this weekend I may find time to answer some.
Hi Joel,
Thanks for the reply. Here's the url where you can view the problem
http://hcs.gts.tsu.biz/test.html. I actually don't need to use the
bgiframe plugin since I don't have any select elements on the page but
I'd like to know I can use it for future projects. If you hover over
the About
On 10/17/07, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote:
Aloha,
When I use the bgiframe plugin with the superfish menus I get a white
background behind the pulldown and the word false behind the
pulldown in msie 6.0 on XP.
Thanks,
Gary
Hi Gary,
This rings a bell. I think it happened to
Hi,
In IE you have to apply z-index to certain ancestors, due to a bug. On
another thread, Olivier Percebois-Garve provided this link to a
discussion of the problem.
http://verens.com/archives/2005/07/15/ie-z-index-bug/
Of particular note on that page is Michael's comment.
Joel Birch.
Thanks
On Oct 10, 3:29 am, Joel Birch [EMAIL PROTECTED] wrote:
Whoops, I obviously need a break. Here is the correct code:
$('#yourNav').superfish({
animation: {height: 'show'},
speed: 1 /* animation speed 1 millisecond */
});
Joel Birch
Thanks for pointing me in the right direction. For anyone else experiencing
the same problem with this plugin..I applied a z-index to the .nav class
Joel Birch wrote:
Hi,
In IE you have to apply z-index to certain ancestors, due to a bug. On
another thread, Olivier Percebois-Garve
Jon replied to me offlist with a secret link. I thought I would reply
with a solution here for completion's sake incase it helps anyone
else.
Long story short, IE has a thing about great-great-etc-grandparents
having z-index set. This should fix the issue for you Jon:
#header { z-index: 99; }
Working on that atm!
On Oct 11, 3:27 am, Joel Birch [EMAIL PROTECTED] wrote:
Hi Jon,
Thanks for your feedback on the commented CSS file! To help solve your
problem though, with so many factors at work we really need a working
page that demonstrates the issue you are trying to solve. Is this
{Jon hangs his head in shame for not thinking this through!}
OMG, I tried setting the parent and the grandparents z-index to bring
it over the lower container without going over the nav!
It never occurred to me to do the great-grandparent too!
Thank you, thank you, thank you Joel!
Now back to
Hi
this seems due the IE z-index bug
see
http://verens.com/archives/2005/07/15/ie-z-index-bug/
olivier
jon randahl wrote:
First, let me say thank you to Joel for making the new CSS for
Superfish so easy to configure now! All those comments make such the
difference!
and Second, here's my
I think what you are wanting to do is described here:
http://users.tpg.com.au/j_birch/plugins/superfish/all-horizontal-example/
Basically, you can use the pathClass option to tell Superfish what
class name you are using to indicate the active menu item, and
Superfish will keep the path to that
Hi,
There are quite a few different issues at play here:
Firstly, the flickering issue is due to your use of the csshover.htc
file. Remove that and your flicker will disappear. Then, in order to
get hovers working in IE, just add a selector that uses the sfHover
class along side the regular
I messed around with that page in with Firebug and added an attribute
to the generated embed tag like so:
style=position:relative;z-index:0;
and this fixed the issue, even without changing the wmode attribute.
Maybe add this to your CSS:
embed, object {
position: relative;
z-index: 0;
Maybe just do:
$('#yourNav').superfish({
height: 'show',
speed: 1 /* animation speed 1 millisecond */
});
Joel Birch.
801 - 900 of 972 matches
Mail list logo
