HomeMottie's Help SiteResourcesSupport Tickets
Sign Up! • Login: Password: New User? Forgot? Support
Top Mods!
Wowhead Search
by sonofsamedi
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?
1 2Next
Lord Trist (New Admin) 5/7/2011 4:13 PM EST : How to get dropdown menus? link
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
Top • Bottom

EngimaShadow (New Admin) 5/9/2011 3:27 PM EST : RE: How to get dropdown menus? link
EngimaShadow
Posts: 287
Fingers of Fury!
Do a google search for javascript drop down menu.  I think that's the only way you can.
Top • Bottom

Mottie (MVP) 5/9/2011 4:41 PM EST : RE: How to get dropdown menus? link
GuildPortal MVP
Mottie
Posts: 3873
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
>>help-site<<
Top • Bottom

Lord Trist (New Admin) 5/10/2011 2:58 AM EST : RE: How to get dropdown menus? link
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}
Top • Bottom

Mottie (MVP) 5/10/2011 9:33 AM EST : RE: How to get dropdown menus? link
GuildPortal MVP
Mottie
Posts: 3873
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
}
>>help-site<<
Top • Bottom

Lord Trist (New Admin) 5/10/2011 4:03 PM EST : RE: How to get dropdown menus? link
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
Top • Bottom

Mottie (MVP) 5/10/2011 7:07 PM EST : RE: How to get dropdown menus? link
GuildPortal MVP
Mottie
Posts: 3873
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.



>>help-site<<
Top • Bottom

Lord Trist (New Admin) 5/10/2011 9:16 PM EST : RE: How to get dropdown menus? link
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
Top • Bottom

Mottie (MVP) 5/10/2011 11:37 PM EST : RE: How to get dropdown menus? link
GuildPortal MVP
Mottie
Posts: 3873
Zomgawsh Poster
Yep that is the "ForumIconCell"... if you want to hide it just add this css to your custom css:
.ForumIconCell { display: none; }
>>help-site<<
Top • Bottom

Lord Trist (New Admin) 5/11/2011 2:49 AM EST : RE: How to get dropdown menus? link
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
Top • Bottom

1 2Next
Admins Online
There are   members online.
GuildPortal Home • Frequently Asked Questions • Videos • Recent Updates • Support • Terms of Use • Privacy Policy
GuildPortal™ Axiom Shift, LLC.  All Rights Reserved. All game-related trademarks are properties of their respective owners. Several adorable monkeys were harmed during the creation of this site, and for that, we are wholly unapologetic.
So-and-so has logged on!
%title%
%message%