Mouse Over Effect - Please Help

[rka81]

Hi

I ownder if someone might be able to tell me how to do a similar mouse over effect like the one on this site http://www.templatemonster.com/category.php?from=1&cat=All

Move over one of the templates and you will see what i mean.....

IS this done with flash or something else?

Thanks in advance

 

[zkiller]

that is done via css (cascading style sheet). for instance try adding this bit of code between the head tags of one of your pages...

<style type="text/css">
<!--

   A:link {text-decoration: none; color: #990000;}
   A:visited {text-decoration: none; color: #990000;}
   A:hover {text-decoration: underline; color: #990000;}
   
-->
</style>

that's the css i use on nmpoc.com.

 

[rka81]

that is done via css (cascading style sheet). for instance try adding this bit of code between the head tags of one of your pages...

<style type="text/css">
<!--

   A:link {text-decoration: none; color: #990000;}
   A:visited {text-decoration: none; color: #990000;}
   A:hover {text-decoration: underline; color: #990000;}
   
-->
</style>

that's the css i use on nmpoc.com.

Mnay Thanks.......but you link to your site didnt work?!! (might be my internet - been dodgy lately!)

 

[rka81]

Ok but how do i get the "previews/images" to come up when i hover over another smaller image?!

Thanks

 

[StephanieCordray]

Here's a sample of the source code from the link you provided:


<LINK rel="stylesheet" href="/css/search.css" type="text/css">
<link rel="stylesheet" href="/seo.css" type="text/css">
<link rel="stylesheet" href="/css/networkbar.css" type="text/css">
<link rel="stylesheet" href="/style.css" type="text/css">
<link rel="icon" href="/favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon">
<SCRIPT src="/js/alt.js" language="JavaScript" type="text/javascript"></SCRIPT>
<SCRIPT src="/js/common.js" language="JavaScript" type="text/javascript"></SCRIPT>
<SCRIPT src="/js/dynwindow.js" language="JavaScript" type="text/javascript"></SCRIPT>

<script src="/js/networkbar.js" language="JavaScript" type="text/javascript"></script>

<script src="/js/preview_templates.js" language="JavaScript" type="text/javascript"></script>
<script src="/js/loader.js" language="JavaScript" type="text/javascript"></script>
<script src="/js/AC_RunActiveContent.js" language="JavaScript" type="text/javascript"></script>
<SCRIPT language="javascript" type="text/javascript">

The part I highlighted in red shows how they do it. They use a javascript called preview_templates.js

You can probably find that script in a number of places. I usually recommend http://javascriptsource.com mostly because it's the only url I can remember off the top of my head.

 

[zkiller]

Ok but how do i get the "previews/images" to come up when i hover over another smaller image?!

Thanks

yeah, my server hasn't been accessible since early this morning. haven't heard back from my ISP yet and i kind of doubt there will be anyone in tomorrow to look into it. so hopefully everything will get worked out sometime on monday.