Html Pictures

Well im trying to make a code but im not sure what it would actually be called. Im trying to make a menu that shows user Names and when you click on it it drops down info and stuff im trying to create something like this any ideas?

Do you mean like a dropdown list, or something like if you hover over a piece of text, a drop down list forms under the piece of text you hovered over?

Here's what you would use for a dropdown list:
http://www.codeproject.com/KB/HTML/Change_DropDown_Text.aspx

The hover over is kinda close but i would like it when some one clicks on it a info page drops down and shows some info
Info i would have is gamertag Name age Game of Choice and favorite weapon

thats closer to what im looking for
simple drawing ill try
---------------------------------------------------------------------------------------------------
Fayko
---------------------------------------------------------------------------------------------------
And when u click on it it brings down a bunch of info and stuff and you have to click on it again to get it to remove it

when it drops down
it would show something like this
-------------------------------------------------------------------------------------
Fayko
Real Name:
Game Most Played:
Gamertag:
HTML GamerCard
Fav Music
Playlist html
------------------------------------------------------------------------------------

-----------------------------------------------------------------------------------
next user
-------------------------------------------------------------------------------------


---- = the box around the name that u click on causing it to drop down


EDIT
Expandable content thats what i was thinking of couldnt name it lol any one know how to make one?

RoNo wrote:

This is something similar I created a few weeks ago:
[ click ]


You could have text or stats-style pop-ups
from thumbnails of the members avatars.

I like this. Sir how did you do that?

LeiZhen, I have info about creating the images *here.
Once you have the images... the code isn't too difficult.


Fayko, a drop down menu like *this may be what
you need to get the options you mentioned above.

It's also in use on *this portal (hover over "About Forumotion" etc)

This is how it's put together

Code:

<style>body{font-family:arial;}table{font-size:90%;background:black}a{color:silver;text-decoration:none;font:bold}a:hover{color:blue}td.menu{background:#444444}table.menu{font-size:90%;position:absolute;visibility:hidden;}</style>

<script type="text/javascript">function showmenu(elmnt){document.getElementById(elmnt).style.visibility="visible";}function hidemenu(elmnt){document.getElementById(elmnt).style.visibility="hidden";}</script>

<center><table width="525px"><tr bgcolor="#444444">

<// Category 1 //>

<td onmouseover="showmenu('About Forumotion')" onmouseout="hidemenu('About Forumotion')"><a href="http://help.forumotion.com/forum.htm"><font size="">About Forumotion</font></a><br /><table class="menu" id="About Forumotion" width="120"><tr><td class="menu"><a href="http://help.forumotion.com/rules-important-points-f10//">Rules & important points</a></td></tr>  <tr><td class="menu"><a href="http://help.forumotion.com/FAQ-c5/-f39/Frequently-Asked-Questions-f5/List-of-all-the-FAQ-s-topics-t478.htm">Frequently Asked Questions</a></td></tr>  <tr><td class="menu"><a href="http://help.forumotion.com/updates-and-new-features-f1/">Announcements / Updates</a></td></tr>  <tr><td class="menu"><a href="http://help.forumotion.com/Tricks-tips-f32/">Tricks & tips</a></td></tr></table></td>

<// Category 2 //>

<td onmouseover="showmenu('Support Forum')" onmouseout="hidemenu('Support Forum')"><a href="http://help.forumotion.com/forum.htm"><font size="">Support Forum</font></a><br /><table class="menu" id="Support Forum" width="120"><tr><td class="menu"><a href="http://help.forumotion.com/connection-problems-f42/">Connection problems</a></td></tr><tr><td class="menu"><a href="http://help.forumotion.com/script-code-problems-f43/">Script (code) problems</a></td></tr><tr><td class="menu"><a href="http://help.forumotion.com/administration-panel-credits-and-domain-names-problems-f44/">Administration panel, credits and domain names problems</a></td></tr><tr><td class="menu"><a href="http://help.forumotion.com/manage-the-appearance-of-your-forum-f45/">Manage the appearance of your forum</a></td></tr><tr><td class="menu"><a href="http://help.forumotion.com/other-problems-f46/">Other problems</a></td></tr><tr><td class="menu"><a href="http://help.forumotion.com/need-of-a-technician-f3/">Need of a technician ?</a></td></tr></table></td>

<// Category 3 //>

<td onmouseover="showmenu('Other Services')" onmouseout="hidemenu('Other Services')"><a href="http://help.forumotion.com/forum.htm"><font size="">Other Services</font></a><br /><table class="menu" id="Other Services" width="120"><tr><td class="menu"><a href="http://help.forumotion.com/hitskincom-support-f48/">Hitskin.com support</a></td></tr><tr><td class="menu"><a href="http://help.forumotion.com/graphic-design-section-f6/">Graphic design section</a></td></tr><tr><td class="menu"><a href="http://help.forumotion.com/forum-reviews-f60/">Forum Reviews</a></td></tr></table></td>

<// Category 4 //>

<td onmouseover="showmenu('Miscellaneous')" onmouseout="hidemenu('Miscellaneous')"><a href="http://help.forumotion.com/forum.htm"><font size="">Miscellaneous</font></a><br /><table class="menu" id="Miscellaneous" width="120"><tr><td class="menu"><a href="http://help.forumotion.com/suggestion-section-f29/">Suggestion section</a></td></tr><tr><td class="menu"><a href="http://help.forumotion.com/forum-promotion-forumotions-only-f12/">Forum promotion (Forumotions only)</a></td></tr><tr><td class="menu"><a href="http://help.forumotion.com/general-discussions-f7/">General Discussions</a></td></tr><tr><td class="menu"><a href="http://help.forumotion.com/garbage-f4/">Garbage</a></td></tr></table></td></tr></table>

Kinda like this
http://fgnw.forumotion.net/Test-h1.htm
another question would be when u click on this link and expand fayko to the right of my name and gamercard is a white space how do i place something in this area?

another question is it possible to use the blank space on this html page
http://fgnw.forumotion.net/Dungeon-Pictures-h2.htm
(right of the thumbnails) that when you click on the thumbnails it displays the larger size on the right instead of taking them to my photobucket?

anyone have an idea?

for the space next to your gamertag ect. It's probably using a table to sort everything, try opening it with a html editor, like notepad and check if it is, then just rearrange your table structure so your descriptions or whatever you want beside your gamertag ect.
Is beside your gamertag

I've reworked the content and created slim versions of
"Expandable Content Boxes" on *this copy of your page.

Spoiler:

Maybe the pop-up script I mentioned earlier will be of use for the
thumb pics issue you spoke of. Do you have full size pics of those.

I do you can find him here in my photobucket
https://s174.photobucket.com/albums/w94/fayko/

how can it be used?

Take a look at these examples:

*1 row of thumbs (for individual game level pages)
You could edit links to "click an image & see full size"
or "click an image and go to a related forum or site".
Here's the code for that example

Spoiler:

*Multiple rows of images (repeated for demonstration)

Spoiler:

Linking images to related forums would be cool for that version.

My choice would be example one

i is love you i loves it mind if i use it multi times?

lol... I don't mind... have fun.

You can edit the position of the pop-up's on the following line:

.thumb:hover span{ visibility: visible;top: +15;left: -170px; }

Use plain numbers such as 25 or add plus/minus signs.

ok thanks ill mark it is as solved <3