Re: [jQuery] Re: Superfish - Arrows don't display on dropdown
without seeing a link it sounds like path problems. Use firebug Net tab
to see if everything is loading
initialsbr wrote:
Also, it appears that the menu works fine on the home page but not on
any of the individual pages. Any suggestions there?
On Jan 17, 7:57pm, initialsbr luke.kirkl...@gmail.com wrote:
I'm really excited to use this bu the arrows aren't displaying on my
menu. Here's the code I've got in the head...
link rel="stylesheet" type="text/css" media="screen" href="" /
script type="text/_javascript_" src=""/
script
script type="text/_javascript_" src=""/script
script type="text/_javascript_" src=""/script
script type="text/_javascript_"
$(document).ready(function(){
$("ul.sf-menu").supersubs({
minWidth: 12,
maxWidth: 27,
extraWidth: 1,
autoArrows: true,
}).superfish();
});
/script
Here's what I've got in the body...
div id="menu"
ul class="sf-menu"
li class="current"
a href="" class="moz-txt-link-rfc2396E" href="http://localhost:/claykirkland/">"http://localhost:/claykirkland/"home/a
/li
li
a href="" class="moz-txt-link-rfc2396E" href="http://localhost:/claykirkland/bio/">"http://localhost:/claykirkland/bio/"bio/a
ul
lia href=""musical/a/li
lia href=""personal/a/li
/ul
/li
li class="current"
a href="" class="moz-txt-link-rfc2396E" href="http://localhost:/claykirkland/events/">"http://localhost:/claykirkland/events/"events/a
/li
li class="current"
a href="" class="moz-txt-link-rfc2396E" href="http://localhost:/claykirkland/music/">"http://localhost:/claykirkland/music/"music/a
/li
li class="current"
a href="" class="moz-txt-link-rfc2396E" href="http://localhost:/claykirkland/photos/">"http://localhost:/claykirkland/photos/"photos/a
/li
li
a href="" class="moz-txt-link-rfc2396E" href="http://localhost:/claykirkland/bio/">"http://localhost:/claykirkland/bio/"shop/a
ul
lia href=""checkout/a/li
lia href=""menu item/a/li
/ul
/li
/ul
/div
In the css I show that the images at...
http://localhost:/claykirkland/superfish/images/
I'm building this using MAMP and Wordpress on my computer. I don't get
it. Everything else works great.
Help!
[jQuery] Re: Superfish - Arrows don't display on dropdown
Also, it appears that the menu works fine on the home page but not on
any of the individual pages. Any suggestions there?
On Jan 17, 7:57 pm, initialsbr luke.kirkl...@gmail.com wrote:
I'm really excited to use this bu the arrows aren't displaying on my
menu. Here's the code I've got in the head...
link rel=stylesheet type=text/css media=screen href=superfish/
css/superfish.css /
script type=text/javascript src=superfish/hoverIntent.js/
script
script type=text/javascript src=superfish/superfish.js/script
script type=text/javascript src=superfish/supersubs.js/script
script type=text/javascript
$(document).ready(function(){
$(ul.sf-menu).supersubs({
minWidth: 12,
maxWidth: 27,
extraWidth: 1,
autoArrows: true,
}).superfish();
});
/script
Here's what I've got in the body...
div id=menu
ul class=sf-menu
li class=current
a
href=http://localhost:/claykirkland/;home/a
/li
li
a
href=http://localhost:/claykirkland/bio/;bio/a
ul
lia
href=#musical/a/li
lia
href=#personal/a/li
/ul
/li
li class=current
a
href=http://localhost:/claykirkland/events/;events/a
/li
li class=current
a
href=http://localhost:/claykirkland/music/;music/a
/li
li class=current
a
href=http://localhost:/claykirkland/photos/;photos/a
/li
li
a
href=http://localhost:/claykirkland/bio/;shop/a
ul
lia
href=#checkout/a/li
lia href=#menu
item/a/li
/ul
/li
/ul
/div
In the css I show that the images at...
http://localhost:/claykirkland/superfish/images/
I'm building this using MAMP and Wordpress on my computer. I don't get
it. Everything else works great.
Help!
[jQuery] Re: Superfish - arrows top menu width
if you look at element widths in css there are no explicit widths set. Default sizing is established by padding on a tags arrows are absolute positioned so setting width to a tags might help. Per your first line, it's all about css Bruce A wrote: Apologies if this is a css issue and I am barking up the wrong tree... It seems to me that the arrows which are added create an additional width on the menu elements. I would like to specify a fixed width for the top elements in my menu. It appears that the arrows are added automagically by the JS (neat!). I am guessing they are an additional width to anything specified in the skin css. Is there any way to use the arrows but to reserve space for the arrow width, so it doesn't change the top level menu width? I would like to be able to use a fixed width, so that I can use a non- repeating css background image. To complicate matters, I am using Supersubs (maybe I should be using the standard superfish?) Thanks to the developer for producing this cool bit of code!
[jQuery] Re: SuperFish Arrows
it's set in the css file at the bottom. Just change the file name and dimensions to suit On Apr 24, 12:09 am, Praveen praveen.rajendrab...@gmail.com wrote: How is the arrows displayed in the superfish menus? If I would like to change to an image of my choice, how do I go about? Regards, Praveen
[jQuery] Re: Superfish arrows and drop shadow
Is that the mark-up output from the server, or is it the generated source as shown in Firebug, ie. after the Superfish JS has run? You did call the plugin's initialisation code I hope? Are the paths to the shadow and arrow images correct? If you show us your page I'm sure we can figure it out far more easily. Joel Birch.
[jQuery] Re: Superfish arrows and drop shadow
Thats the markup. When you say 'You did call the plugin's initialisation code I hope?' what do you mean exactly. I'm a bit of a beginner as you probably have guessed. Also where are the images stored? I haven't got any images for the arrow and shadow myself, am I meant to? Sorry, the page is only local atm so cant show you. Thanks
[jQuery] Re: Superfish arrows and drop shadow
It does seem most likely that you haven't actually activated the
plugin code and all you are seeing is the pure CSS fallback version of
the menu. If you go to the Superfish documentation pages you will find
plenty of information about setting up menus in a variety of ways, but
specifically, look at Step 3 of the Quick Start Guide on the entry
page. You need to include that code to trigger the plugin's JS that
you linked to in a script tag.
http://users.tpg.com.au/j_birch/plugins/superfish/
Also, once the initialisation code has run, it will add various
classes to your menu markup, including the anchors' sf-with-ul class
where relevant, so you do not need to add that to your markup
manually.
Regarding the images, they come as part of the standard download (zip
archive) and are used for the arrow and the shadow. In the
superfish.css file the images are referred to like this, for example:
background: url('../images/shadow.png') no-repeat bottom right;
This means that you either need to put the images in an 'images'
folder, one level higher than the directory that the CSS file is in,
or you can change the path to point to the images if you prefer to
keep them elsewhere.
Hope this helps.
Joel Birch.
[jQuery] Re: Superfish arrows and drop shadow
Haha I can be an idiot sometime! The reason I wasn't seeing the shadow or arrow was because rather than downloading the zip file I had simply downloaded the code files seperately. I was calling the initialisation code etc (as explained by your very easy to use demos) but by my own foolish mistake I didnt download the images. Thanks a lot for your help, the menu looks and works really well. I knew there'd be a simple answer ;-) Thanks
