hi
im trying to add the class “current” from this menu
http://www.cssplay.co.uk/menus/pro_dropline.html
second example
…with top level ‘current selection’ tab
to this menu
http://www.cssplay.co.uk/menus/pro_left_right_line.html
appreciate any help
and he makes me always look bad on here. Well, time to go again.
No you raised good points and we do want members to try and help themselves first or at least learn from the experience.
of course it does, Paul did it, and he never gets tired of “helping” no-interest-to-learn and no-money-to-spent kiddies like yourself - unlike some of his fellow Sitepointers, and he makes me always look bad on here. Well, time to go again.
Sorry, I can’t help you here, as I said, I won’t provide you with the actual solution. I can help you tell you why your solution doesn’t work, or where you need to improve upon it - but I don’t believe Sitepoint is a place for freebes like, hey please put these two codes together for me. I help you learn how to do it, but that’s pretty much it. If you want somebody code something for you, there’s elance.com and similar sites out there.
As c2uk said it would be better if you showed us what you had done so far and then we could point you in the right direction and then you would learn where you went wrong.
If you are trying to implement a “current” tab then the basics are that you would look to create a class to mimic the styles that are already being activated on hover. As the styles are already in place you would just need to add the extra rules into the right places.
e.g. As a starting point you would change these items for the left hand menu.
.pro_linedrop .select a:hover, .pro_linedrop .select li:hover a[B], .pro_linedrop .select li.current a[/B] {
background: url(menus/lrimages/black_1.gif);
padding:0 0 0 15px;
cursor:pointer;
color:#fff;
}
.pro_linedrop .select li.lrt a:hover, .pro_linedrop .select li.lrt:hover a {
background: url(menus/lrimages/blue_1.gif);
}
.pro_linedrop .select a:hover b, .pro_linedrop .select li:hover a b {
display:block;
float:left;
padding:0 30px 0 15px;
background:url(menus/lrimages/black_1.gif) right top;
cursor:pointer;
}
.pro_linedrop .select li.line a:hover b, .pro_linedrop .select li.line:hover a b[B],.pro_linedrop .select li.current a b [/B]{
background:url(menus/lrimages/black_1a.gif) right top;
}
.pro_linedrop .select li.lrt a:hover b, .pro_linedrop .select li.lrt:hover a b {
background:url(menus/lrimages/blue_1.gif) right top;
}
.pro_linedrop .select li.lrt a:hover b.arrow, .pro_linedrop .select li.lrt:hover a b.arrow{
background:url(menus/lrimages/blue_1a.gif) right top;
}
.pro_linedrop .sub {
position:absolute;
left:-9999px;
width:0;
}
/* IE6 only */
.pro_linedrop table {
border-collapse:collapse;
margin:-1px -10px -1px -1px;
font-size:1em;
width:0;
height:0;
}
.pro_linedrop .sub {
margin:0;
padding:0;
list-style:none;
}
.pro_linedrop .sub li {
background:transparent;
}
.pro_linedrop .select :hover .sub[B],.pro_linedrop .select .current .sub[/B] {
height:25px;
position:absolute;
width:743px;
top:35px;
left:0;
text-align:center;
background:#fff url(menus/lrimages/fade.gif);
border:1px solid #aaa;
}
.pro_linedrop .select :hover .rt li {
float:right;
}
.pro_linedrop .select :hover .sub li a[B],.pro_linedrop .select .current .sub li a [/B]{
display:block;
height:25px;
line-height:22px;
float:left;
background:#fff url(menus/lrimages/fade.gif);
padding:0 16px;
margin:0;
white-space:nowrap;
color:#333;
font-size:10px;
}
The current class is then manually added to the menu item in question.
<div class="pro_linedrop">
<ul class="select">
<li><a href="#nogo"><b>Home</b></a></li>
<li class="line [B]current[/B]"><a href="#nogo"><b>Products</b>
<!--[if gte IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul class="sub">
<li><a href="#nogo">Cameras</a></li>
<li><a href="#nogo">Lenses</a></li>
<li><a href="#nogo">Flashguns</a></li>
<li><a href="#nogo">Tripods</a></li>
<li><a href="#nogo">Filters</a></li>
</ul>
etc....
You would then need the same approach for the items in the right hand menu if you are using the exact same format as shown in Stu’s site.
IE6 will probably need some extra work but I prefer to use the suckerfish method rather than the nested anchor approach.
as i said im trying to add the “current” class from that menu
im good with copy paste and edit i dont know how to solve it so this why im asking for help maybe im in the wrong forum
im not here to learn css i think paul is a very good person cause he helped me
iv opened this thread to get help and he helped i dont know what the prob here iv got this menu over then week and i sit hours evry day trying to solve it , im not kidding hours so i decided to turn to some experts in this forum and others and the only help that iv got is from paul …
so c2uk is it wrong to ask help from others ?
i know the basics of css
iv allready tried that but didnt work in the first menu the class current show the subs automatically thats what im trying to add to the second menu
tnx
work like a charm
Tnx Paul :)
I suppose SitePoint is mostly a forum for developers asking each other’s help with code they’ve written, which is something different from people saying “I want some code that does x, code it for me”.
If you know CSS, then you save all those hours and hours trying to get something simple to work… though I will say I find Stu’s CSS very confusing… my first dropdown menu was one of Stu’s and I had a heck of a time with it. After learning to write my own, things generally went much, much better and I stopped losing hair.
I suppose if someone makes it very clear that they want someone to code something for them, and what they’re basing it on, then people will know whether to help or not (some people like Paul don’t mind coding for free and he knows other people reading the thread can learn something from his answer). Your first post didn’t really give a whole lot of information either way, so c2uk couldn’t tell if it was a request for “code this for me” or if it just was a bad (not finished) question.
A lot of nerds on forums and IRC use ESR’s How To Ask A Question as their basis for answering (and the intro I linked to kinda explains why).
All that said, there’s no sign on the main SitePoint forums page that states “No Script Kiddies” so it’s rather ambiguous what kinds of questions we get here, nothing telling you that you can’t just ask for code. I think the best thing to do is make it clear what you’re asking: to learn how to do x, or for code that does x.
Sometimes I write code and sometimes I don’t… seems to depend on my mood. That and I don’t have the energy of Paul. What brand of amphetamines do you use, Paul??
what exactly is it that you don’t understand here?
Can you please post your effort and tell us what doesn’t work. Or tell us what you don’t understand about CSS.
Note, I’m not going to provide you with the full actual solution (even if it is very easy and doesn’t require much time to do so), other Sitepoint users may very well do this, that’s their choice if they want to encourage such behaviour.
I know what you’re trying to do, but what is it that you don’t understand about it? it’s not that CSS is overly complex or difficult to understand.
you can add a css class to any element by just adding the class name to it:
<li class="classname"><a href="http://example.com">Home</a></li>
or multiple classes:
<li class="classname class2"><a href="http://example.com">Home</a></li>
And please make an effort to learn at least the basics of CSS, for example at htmldog