Stumble it!
   
Delicious Del
   


A New Way Of Linking With Scrollovers



By AN Jay on May 3, 2008

Don't Forget to participate in contest because SyncMate Is Giving Away 15 Single User Expert Edition Licenses - Just Comment Now For A Chance To Win

  Advertisement

scrollovers 

Scrollovers are a way to quickly and easily add flair to your web pages, giving your users an experience they weren’t expecting.

Advertisement

Integration of Scrollovers into your web site couldn’t be easier, even if you’ve already built the site that you want to include Scrollovers on. In just minutes you will be able to have them appearing on your own pages.

How do you add it to your pages?

  • Copying the code below into your page (alternatively you can

    <script type=”text/javascript” src=”http://www.scrollovers.com/js/scrollovers.js”></script>

  • Your links should look similar to the one below

    <a href=”[YOUR PAGE HERE]” class=”scrollover” type=”scrollover”>[YOUR TEXT HERE]</a>

  • Make it pretty (see below)

Copy the styling code below into your page or stylesheet

<style>
   a.scrollover {
      /* Default Colour/Styles here */
      color: #557AFF;
   }
   a.scrollover em:first-line {
      /* Rollover Colour/Styles here */
      color: #FF5B3C;
   }
</style>




If you enjoyed this post, please consider to leavea comment or subscribeto the feed and get future articles delivered to your feed reader.

You May be Interested In More Interesting Free Resources

Comments

Entirely lame. We might as well bring back the blink element. A bunch of unnecessary javascript to clutter up your d/l speed.

But you’re right about one thing. Users won’t expect it. Just like I don’t expect those double-hyphened underlined words on some websites that cause advertisements to pop open as my mouse cursor just brushes against them. Or just like the stupid Snap previews that everyone is using.

Just because you can….

I’m not sure what I was supposed to see, but it doesn’t do anything in FF on XP32. Nice hack guys.

Good article, Thanks a lot!

Leave a comment

(required)

(required)