Sign Up! Login: Password: New User? Forgot? Support
Top Mods!
Wowhead Search
by sonofsamedi
Digital Clock
by Wolfar15
Admin Forums
Welcome to the GuildPortal Help Community! These forums are for admin-to-admin help.
Available Forums
Forums : Pimp My Site! > How to get dropdown menus?
Lord Trist (New Admin) 5/7/2011 4:13 PM EST : How to get dropdown menus?
Lord Trist
Posts: 907
Zomgawsh Poster

Ok ive been searching all over GP to no avail but i culd just be blind XD What i want to do is make it so when you hover over my Nav Bar Images a dropdown menu appears to wich you can click to go to other links and pages on the website. So any1 know how?

http://thedark.sithportal.com/Guild.aspx?GuildID=397606&TabID=3364123
TopBottom

EngimaShadow (New Admin) 5/9/2011 3:27 PM EST : RE: How to get dropdown menus?
EngimaShadow
Posts: 287
Fingers of Fury!

Do a google search for javascript drop down menu.  I think that's the only way you can.
TopBottom

Mottie (MVP) 5/9/2011 4:41 PM EST : RE: How to get dropdown menus?
GuildPortal MVP
Mottie
Posts: 3883
Zomgawsh Poster

Hiya!

I've been super busy lately, but maybe check out Superfish menu... download the zip and copy the layout in the example.html file. This code would be added to the header HTML
TopBottom

Lord Trist (New Admin) 5/10/2011 2:58 AM EST : RE: How to get dropdown menus?
Lord Trist
Posts: 907
Zomgawsh Poster

ok thanks guys i found some stuff... but this is WAY beyond me XD if i just use like their codes for JAva and CSS its in CSS that i would put my images right?
Like heres an example How would i make it use pictures i upload to photobucket? or would that be in the HTML or something?

#sddm
{ margin: 0;
padding: 0;
z-index: 30}


#sddm li
{ margin: 0;
padding: 0;
list-style: none;
float: left;
font: bold 11px arial}



#sddm li a
{ display: block;
margin: 0 1px 0 0;
padding: 4px 10px;
width: 60px;
background: #5970B2;
color: #FFF;
text-align: center;
text-decoration: none}


#sddm li a:hover
{ background: #49A3FF}

#sddm div
{ position: absolute;
visibility: hidden;
margin: 0;
padding: 0;
background: #EAEBD8;
border: 1px solid #5970B2}


#sddm div a
{ position: relative;
display: block;
margin: 0;
padding: 5px 10px;
width: auto;
white-space: nowrap;
text-align: left;
text-decoration: none;
background: #EAEBD8;
color: #2875DE;
font: 11px arial}


#sddm div a:hover
{ background: #49A3FF;
color: #FFF}

TopBottom

Mottie (MVP) 5/10/2011 9:33 AM EST : RE: How to get dropdown menus?
GuildPortal MVP
Mottie
Posts: 3883
Zomgawsh Poster

Hi!

Having no idea what your HTML looks like, I'm guessing you would add the background images to the <a>'s, sort of like this (modification of your code above, so don't remove stuff I didn't include):
#sddm li a {
 display: block;
 margin: 0 1px 0 0;
 padding: 4px 10px;
 width: 60px;
 background: #5970B2 url(LINK TO THE DEFAULT IMAGE) center center no-repeat;
 color: #FFF;
 text-align: center;
 text-decoration: none
}

#sddmlia:hover {
 background: #49A3FF url(LINK TO THE IMAGE WHILE BEING HOVERED) center center no-repeat;
}

#sddmdiva{
 position: relative;
 display: block;
 margin: 0;
 padding: 5px 10px;
 width: auto;
 white-space: nowrap;
 text-align: left;
 text-decoration: none;
 background: #EAEBD8 url(LINK TO THE DEFAULT IMAGE) center center no-repeat;
 color: #2875DE;
 font: 11px arial
}

#sddmdiva:hover {
 background: #49A3FF url(LINK TO THE IMAGE WHILE BEING HOVERED) center center no-repeat;
 color: #FFF
}
TopBottom

Lord Trist (New Admin) 5/10/2011 4:03 PM EST : RE: How to get dropdown menus?
Lord Trist
Posts: 907
Zomgawsh Poster

OHHHHH ok i see thank you SOOO much mottie gonna try and get this worked out today you2 have helped allot thank u mottie one more question if u dont mind in ur post on the CSS "titles" for certain aspects of the forums the name of the first cell "where forum specific images go" the one to the left of the "new posts" or " no new posts" what is the name for that in CSS? if i didnt explain it very well just leme knwo XD
TopBottom

Mottie (MVP) 5/10/2011 7:07 PM EST : RE: How to get dropdown menus?
GuildPortal MVP
Mottie
Posts: 3883
Zomgawsh Poster

Do you mean ".ForumIconCell"? If you want to target the actual image, you need to use ".ForumIconCell img". If that isn't correct. Check out my bookmarklet which highlights parts of your page.



TopBottom

Lord Trist (New Admin) 5/10/2011 9:16 PM EST : RE: How to get dropdown menus?
Lord Trist
Posts: 907
Zomgawsh Poster

ya i looked through the bookmarklet before but its to the Left of that on my forums

thedark.sithportal.com

youll see an empy cell box thats where the forum image goes like for a space forum i culd put a pic of a spaceship i want to remove that.
I wen all through the bookmarklet and found nothing that described the cell to teh Left of the read or not read cell
TopBottom

Mottie (MVP) 5/10/2011 11:37 PM EST : RE: How to get dropdown menus?
GuildPortal MVP
Mottie
Posts: 3883
Zomgawsh Poster

Yep that is the "ForumIconCell"... if you want to hide it just add this css to your custom css:
.ForumIconCell { display: none; }
TopBottom

Lord Trist (New Admin) 5/11/2011 2:49 AM EST : RE: How to get dropdown menus?
Lord Trist
Posts: 907
Zomgawsh Poster

Nope thats teh wrong area ill post pics so i can better explain thats probly the issue
This is before the code you gave me and the exact cells i want to remove.
 

This is after your code it removes the Newposts and no new posts cell
 

If your not sure of what the cell name is then would i like put a ticket in? or can i look it up somewhere? sorry to confuse u btw Mottie im terrible at explaining things haha
TopBottom

Admins Online
There are   members online.
So-and-so has logged on!
%title%
%message%