Help - Search - Members - Calendar
Full Version: Fancy Search Box
HTMLHelp Forums > Web Authoring > Cascading Style Sheets
LondonTom
Mar 15 2009, 06:54 PM
Hi, i was trying do a "Web 2.0" style navigation and seach box(shown as an image in screen shot attached). .. I got the actual navigation working, so it changes when hovered over how ever I was wondering how to go about the search box? Any help would be swell, I was also hoping to have the magnifying glass as the submit button.

Here's the code I am using for the navigation and fake search box:

CODE
<td><a href="file:///C|/xampp/htdocs/index.html" target="_top" onClick="MM_nbGroup('down','group1','home','',0)" onMouseOver="MM_nbGroup('over','home','images/nav/hover/images/search_02.png','',0)" onMouseOut="MM_nbGroup('out')"><img src="images/nav/normal/images/search_02.png" alt="" name="home" border="0" id="home" onload="" /></a></td>
    <td><a href="/shops.html" target="_top" onClick="MM_nbGroup('down','group1','shops','',1)" onMouseOver="MM_nbGroup('over','shops','images/nav/hover/images/search_03.png','',1)" onMouseOut="MM_nbGroup('out')"><img src="images/nav/normal/images/search_03.png" alt="" name="shops" border="0" id="shops" onload="" /></a></td>
    <td><a href="/photoalbum.html" target="_top" onClick="MM_nbGroup('down','group1','photoAlbum','',1)" onMouseOver="MM_nbGroup('over','photoAlbum','images/nav/hover/images/search_04.png','',1)" onMouseOut="MM_nbGroup('out')"><img src="images/nav/normal/images/search_04.png" alt="" name="photoAlbum" border="0" id="photoAlbum" onload="" /></a></td>
    <td><a href="/themes.html" target="_top" onClick="MM_nbGroup('down','group1','themes','',1)" onMouseOver="MM_nbGroup('over','themes','images/nav/hover/images/search_05.png','',1)" onMouseOut="MM_nbGroup('out')"><img src="images/nav/normal/images/search_05.png" alt="" name="themes" border="0" id="themes" onload="" /></a></td>
    <td><a href="/contactus.html" target="_top" onClick="MM_nbGroup('down','group1','contactUs','',1)" onMouseOver="MM_nbGroup('over','contactUs','images/nav/hover/images/search_06.png','',1)" onMouseOut="MM_nbGroup('out')"><img src="images/nav/normal/images/search_06.png" alt="" name="contactUs" border="0" id="contactUs" onload="" /></a></td>
    <td><a href="SearchHopefully" target="_top" onclick="MM_nbGroup('down','group1','search','',1)" onmouseover="MM_nbGroup('over','search','','',1)" onmouseout="MM_nbGroup('out')"><img name="search" src="images/nav/normal/images/search_07.png" border="0" alt="" onload="" /></a></td>
    <td> </td>
  </tr>
</table>
Darin McGrew
Mar 16 2009, 12:25 AM
Please see the FAQ entry How do I use forms?
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.
Invision Power Board © 2001-2010 Invision Power Services, Inc.