...

View Full Version : on hover expand menu



jasonc310771
12-14-2007, 10:48 AM
I have copied the code from the following site
www.fish4jobs.co.uk

after you have done a search say 'admin' you get the results.

near the top you have a RSS feed you can click.

it is this code that i want to use.

i have copied the code but i have not got the 'popup' class

i have looked all around but can not seem to find it.

please can someone take a look and see if they have better luck as i am still new to css.

or has anyone got a css popup class that would work with the following code i have already got so far.


thanks in advance for your help.



<div style="float:right;">



<div id="rss">
<a href="/iad/rss?SearchId=SEARCH_ID_JOBS&Keyword=admin&Number_Of_Days=0&I1=0&I10=20&LoginId=-1&createdTime=1197625434383&chk=786db34786ea2085ad557beb3d55a3c0"><img src="http://assets.fish4.co.uk/live/images/rss/rss.gif" alt="RSS" id="rss" /></a>
<div id="rssmenu" style="background:#ec5502 url(http://assets.fish4.co.uk/live/images/rss/background.jpg) repeat-x;">
<p><a href="/iad/rss?SearchId=SEARCH_ID_JOBS&Keyword=admin&Number_Of_Days=0&I1=0&I10=20&LoginId=-1&createdTime=1197625434383&chk=786db34786ea2085ad557beb3d55a3c0" style="background-image:url(http://assets.fish4.co.uk/live/images/rss/arrow.gif);background-position:2% 50%;background-repeat:no-repeat;">Subscribe to results feed</a><p>

<p><a href="/iad/info/rss" class="popup" style="background-image:url(http://assets.fish4.co.uk/live/images/rss/arrow.gif);background-position:2% 50%;background-repeat:no-repeat;">What is RSS?</a></p>
<ul>
<li><a href="http://my.msn.com/addtomymsn.armx?m=1&amp;id=rss&amp;ut=http%3A%2F%2Fwww.fish4.co.uk%2Fiad%2Frss%3FSearchId%3DSEARCH_ID_JOBS%2 6Keyword%3Dadmin%26Number_Of_Days%3D0%26I1%3D0%26I10%3D20%26LoginId%3D-1%26createdTime%3D1197625434383%26chk%3D786db34786ea2085ad557beb3d55a3c0" class="add" style="background-image:url(http://assets.fish4.co.uk/live/images/rss/msn.gif);background-position:2% 50%;background-repeat:no-repeat;">Add to MSN</a></li>
<li><a href="http://e.my.yahoo.com/config/cstore?.opt=content&amp;.url=http%3A%2F%2Fwww.fish4.co.uk%2Fiad%2Frss%3FSearchId%3DSEARCH_ID_JOBS%26Keyw ord%3Dadmin%26Number_Of_Days%3D0%26I1%3D0%26I10%3D20%26LoginId%3D-1%26createdTime%3D1197625434383%26chk%3D786db34786ea2085ad557beb3d55a3c0" class="add" style="background-image:url(http://assets.fish4.co.uk/live/images/rss/yahoo.gif);background-position:2% 50%;background-repeat:no-repeat;">Add to Yahoo!</a></li>
<li><a href="http://www.bloglines.com/sub/http://www.fish4.co.uk/iad/rss?SearchId=SEARCH_ID_JOBS&Keyword=admin&Number_Of_Days=0&I1=0&I10=20&LoginId=-1&createdTime=1197625434383&chk=786db34786ea2085ad557beb3d55a3c0" class="add" style="background-image:url(http://assets.fish4.co.uk/live/images/rss/bloglines.gif);background-position:2% 50%;background-repeat:no-repeat;">Add to Bloglines</a></li>
<li><a href="http://www.google.com/ig/add?feedurl=http%3A%2F%2Fwww.fish4.co.uk%2Fiad%2Frss%3FSearchId%3DSEARCH_ID_JOBS%26Keyword%3Dadmin%2 6Number_Of_Days%3D0%26I1%3D0%26I10%3D20%26LoginId%3D-1%26createdTime%3D1197625434383%26chk%3D786db34786ea2085ad557beb3d55a3c0" class="add" style="background-image:url(http://assets.fish4.co.uk/live/images/rss/google.gif);background-position:2% 50%;background-repeat:no-repeat;">Add to Google</a></li>
<li><a href="http://www.newsgator.com/ngs/subscriber/subext.aspx?url=http%3A%2F%2Fwww.fish4.co.uk%2Fiad%2Frss%3FSearchId%3DSEARCH_ID_JOBS%26Keyword%3Dadm in%26Number_Of_Days%3D0%26I1%3D0%26I10%3D20%26LoginId%3D-1%26createdTime%3D1197625434383%26chk%3D786db34786ea2085ad557beb3d55a3c0" class="add" style="background-image:url(http://assets.fish4.co.uk/live/images/rss/newsgator.gif);background-position:2% 50%;background-repeat:no-repeat;">Add to Newsgator</a></li>

</ul>
</div>
</div>
</div>

Shoot2Kill
12-15-2007, 08:20 AM
HTML CODE, NEEDS MODIFYING FOR YOUR CONTENT, LOOK AT ORIGINALK SOURCE FOR ORIGINAL IMAGE URL's

Not PHP, just better forum code layout...


<div id="rss">
<a href="RSS_LINK"><img src="RSS_IMAGE" alt="RSS" id="rss"></a>

<div id="rssmenu" style="background: rgb(236, 85, 2) url(URL_TO_BG_IMAGE) repeat-x scroll 0&#37; 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;">
<p>
<a href="LINK_TO_RSS_SUBSCRIPTION" style="background-image: url(ARROW_IMG_URL); background-position: 2% 50%; background-repeat: no-repeat;">Subscribe to results feed</a></p><p>
</p>
<p>
<a title=" (opens in a pop-up window)" href="LINK_TO_RSS_HELP_FILE" class="" style="background-image: url(ARROW_IMG_URL); background-position: 2% 50%; background-repeat: no-repeat;">RSS LINK</a>
</p>
<ul>
<li><a href="RSS_POPUP_LINK" class="add" style="background-image: url(ICON_IMAGE_URL); background-position: 2% 50%; background-repeat: no-repeat;">ADD THIS LINK</a></li>
<li><a href="RSS_POPUP_LINK" class="add" style="background-image: url(ICON_IMAGE_URL); background-position: 2% 50%; background-repeat: no-repeat;">ADD THIS LINK</a></li>
<li><a href="RSS_POPUP_LINK" class="add" style="background-image: url(ICON_IMAGE_URL); background-position: 2% 50%; background-repeat: no-repeat;">ADD THIS LINK</a></li>
<li><a href="RSS_POPUP_LINK" class="add" style="background-image: url(ICON_IMAGE_URL); background-position: 2% 50%; background-repeat: no-repeat;">ADD THIS LINK</a></li>
<li><a href="RSS_POPUP_LINK" class="add" style="background-image: url(ICON_IMAGE_URL); background-position: 2% 50%; background-repeat: no-repeat;">ADD THIS LINK</a></li>
</ul>
</div>
</div>


ONLY TWO CSS ID's USED: rssmenu & rss
CSS CODE FOR THE ABOVE ID's...


/* ------------ RSS drop-down ------------ */

#rss {width:44px;position:relative;display:block;float:left;}
#rss img {z-index:1;}
#rss:hover #rssmenu {display:inline;}
#rssmenu {position:absolute;top:16px;margin-left:-195px;z-index:1000;display:none;line-height:2em;width:185px;padding:0.4em;color:#ffffff;border:1px solid #ffffff;}
#rssmenu ul {list-style-type:none;margin:0px;padding:0.4em 0px 0px 0px;border-top:1px solid #ffa849;}
#rssmenu li {width:100%;clear:left;}
#rssmenu a {padding-left:25px;text-decoration:none;display:block;color:#ffffff;}
#rssmenu a:hover {color:#eb5500;background-color:#ffffff;}
#rssmenu a:visited {color:##ffffff;}


HOPE THIS HELPS... HAVE NOT TESTED IT, JUST USED ORIGINAL CODE, AND MADE IT EASILLY EDITABLE..

MSG BACK IF YOU REQUIRE ANY MORE HELP...


ohh, sorry for caps, didn't realize until was posted:S

jasonc310771
12-17-2007, 12:32 PM
thanks for that, it works.

not sure what to do but i wanted to get it all on the right hand side of a div

i want to have this feature just to the right of the centre of my page.
it is not always going to be in the same position so need to have a way to alter the position. or have it so it will just sit inside a <div></div> and show where ever i have this div placed on my site.

one page it will be here and another it will be there!

how can i do this easily

thanks again for your help.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum