Text Link Rollovers - Gerat effect for your websites

free web hosting
Free Web Hosting > Computers & Tech > Internet and Websites

Text Link Rollovers - Gerat effect for your websites

saga
Here is a simple effect for your website. What it does is when you hover your mouse icon to the text link it will change its color.

1. Write this code in the head portion of your page. The head portion is where you will find the <HEAD> tag.

a.mylink:hover {color:#FF0000}

this is the code responsible in changing the color of your text link into red if the mouse icon is pointed to the text link.

2. Whatever link you want to change into red everytime the mouse icon is pointed in to it, just add this code in the <a> tag class="mylink"
example:
<a href="http://www.yahoo.com" class="mylink">Go To Yahoo</a>

So there it goes.
But actually there are many things you can do. Not just the color. You could also change the font size or make the underline disappear. You could even make it italic or bold. Try it.

Reply

Nqon
This is not right... you need to tell the browser that your writing in css.
So you need to have <style type='text/css'> before you write that line of css and </style> after. You might also want to define the way the link looks when your not hovering it.

You can do something like:
<style type='text/css'>

a.mylink {
font-family: Arial;
font-weight: bold;
color:#000000
}

a.mylink:hover {
color:#FF0000
}
</style>
and then use the class="mylink" tag.

It would show up as a black bold Arial link that turnes red when you hover it.

Reply

potnuru
I do not know as much as you guys do, but I can still produce the same effect using Microsoft FrontPage.

Just go to Page Properties, click on the advanced tab, and then click on the Rollover Effects button and specify what you want it to look like.

For those who dont know designing as well (like me) this is an easier alternative.

Reply

Trishtt
Well you could add blur, shadows, glowing, etc text
you could go on http://www.lissaexplains.com/fun7.shtml to know how.
And you could you could go on http://dynamicdrive.com/ to know other stuff! ( I like that site, it's the best so far! )

Reply

jet
But most of those effects only work in IE, and so the "look" of the site is totally lost for the large droves of people (myself included) that use other browsers like Mozilla Firefox. Dynamic Drive provides some nice codes for menus, calenders and such but the Internet.Com JavaScript Site has a lot more content.

Reply

saga
Sori guys about the erroneous post about the text link rollovers... i was in hurry last time... anyway for my mistake i think i must give more time this time around
here is the whole code ...

CODE
<head>
<style type="text/css">
a.mylink:link {color:#000000}
a.mylink:visited {color:#000000}
a.mylink:hover {color:#FF0000}
a.mylink:active {color:#000000}

</style>
<head>

.....

anotomy of the code
i think you already knew what the <style type="text/css"> .... </style> are for. If you havent read ngon's reply it reminds the browser what kind of style you are using in your page...

a.mylink:link {color:#000000} is a class declaration of mylink as an <a> tag. The { } is the property of that class. Here we are assigning its color to be black (#000000). In this line of code it will make the text link have the color of black in its normal state which means it is not click or not being hover or a link not yet visited

a.mylink:visited {color:#000000} is the same class with the first one. The only difference is it is all about the state of the link when it will be visisted. In our example the text link using this class will remain black if someone has already visited the link.

a.mylink:hover {color:#FF0000}
is the state in which a mouse is hover to the text link. This time it will not remain black but will turn red. When the mouse is moved away from the link it will turn back to black becuase we want it to be black in its normal state using the first code a.mylink:link {color:#000000}.

a.mylink:active {color:#000000} is the same idea with the rest. This is about the active state of the link

...
I hope i made everything clear smile.gif
But actualy there are lots you can do not just color. Here are some properties you can play with...

text-decoration:value -- value could be none or underline
-- removes or put underline to the link
font-size:value -- value is the size of the font in points I guess smile.gif
-- changes the font size
font-weight:value -- it could be bold or normal
-- you cold make the font bold or just normal
font-family:value -- value will be the font face or type of font

there are lots but i think this will do....

here how to use this properties...

a.mylink:link {color:#000000;text-decoration:underline;font-family:times}
a.mylink:visited {color:#000000;text-decoration:underline;font-family:times}
a.mylink:hover {color:#FF0000;text-decoration:none;font-family:arial}
a.mylink:active {color:#000000;text-decoration:underline;font-family:times}
this sample codes will make the underline disappear, change color and change its font type to arial of a text link everytime the mouse is hover

 

 

 


Reply

warbird
Thank you a lot guys smile.gif , I was searching for this thing for months ( maybe some less, but don't care smile.gif ), the result will soon be visible on my site, when I've got the required credits. Maybe it's not very good, but I'm not very good in making sites.

Reply

enemista
QUOTE(jet @ May 24 2005, 03:48 AM)
But most of those effects only work in IE, and so the "look" of the site is totally lost for the large droves of people (myself included) that use other browsers like Mozilla Firefox. Dynamic Drive provides some nice codes for menus, calenders and such but the Internet.Com JavaScript Site has a lot more content.
*



I would say, that majority of surfers are still using IE as their browsers.

Anyway, these rollover texts are great way to hide your affiliates links for example if you have website dedicated to selling some stuff as an affiliate, you can make those links to not look like affiliates but link 'Buy new computer here' and it will add trust to your site.

Reply


Got an Opinion! Express your Views! (no registration):-
Add your Reply/ Opinion/ Views/ Comments/ Suggestion/ Questions/ Queries etc.
Posts with decent grammar & English will be accepted and please refrain from profanities.
For asking a Question, We recommend you to sign-up (for free) so that you can track the topic easily.

Nature of your Post*: Opinion/ Reply/ Comments
Question/Query
Feedback to us.
       
Name   Email
Title/Question*

(Maximum characters: 10,000)
You have characters left.

Similar Topics

Keywords : text link rollovers gerat websites

  1. Alt Txt Tooltip Popups Over Text Links, How To Do? - searching for a simple way... (11)
    How can I insert an alt txt caption for a text link, so that when they hover over the text it pops
    up with more info about the link before the person clicks on it? Do I have to use an image map over
    the text for that, or is there a simple function that does the trick?...
  2. Hack Websites - using a simple javascript (8)
    Sometimes, I come across websites that are very annoying, like webpages which play embedded music
    files or excessive animations. Seems that people who encouter such websites like me have a solution
    is you use Firefox. Just use an extension and you can hack and alter these websites and webpages!
    According to Wired (http://www.wired.com/wired/archive/13.09/start.html?pg=7): QUOTE Remix
    culture has hit the browser. Just as you can pimp your Scion with snap-on parts, you can modify Web
    sites to suit your tastes - whether the authors like it or not. The enabling technol...
  3. Macromedia Flash Websites - (0)
  4. 10 Extremely Useful Websites To Stop Big Brother From Snooping On You - (5)
    10 Extremely Useful Websites to Stop Big Brother From Snooping on You I just read this excellent
    article that i think could be helpful for all of us, as it's name says it shows up 10 of the
    most useful website to stop spam, junk mail, etc. From the article: QUOTE If you are tired of
    receiving junk mail, spam and annoying telemarketing phone calls, then this list is for you. If you
    desire to take steps to stop the snooping from the government, hackers and marketing agencies, then
    this list will show you the way to privacy freedom. People probably don’t reali...
  5. Websites With Communities - myspace, facebook, yearbook, friendster (7)
    I prefer myspace over any other options but whats your opinion...if you had to choose between
    myspace, myyearbook, facebook and friendster which would you choose as the best? The only nifty
    thing about myyearbook is the battles and the lunchmoney as ridiculous as it sounds. facebook has a
    rating system that seems pretty interesting but still in my opinion nothing can compare to the glory
    of myspace...
  6. Websites For Teens - (12)
    what best website topics are good for keeping teens interested? Also, what factors do you know of
    that influence teen interest?...
  7. Website Directory ! - No link back required !!! (3)
    Visit http://www.jbi.in/links/ and join our website directory . QUOTE NO LINK BACK REQUIRED
    After registering please post here for speedy approval ....
  8. Supercharge Your Broadband Link With Free DNS From OpenDNS - (0)
    I just came across this great free DNS service called OpenDNS which can prove to be an
    effective solution for all those broadband users suffering from high address resolution latency.
    For most part our own ISP's DNS Servers are pretty much ill-configured and in my case gives up
    on me quite often. Here's an excerpt from my article at Chaos Lab.. QUOTE(Chaos Lab) Do
    you often encounter slow page-load times despite using a decent broadband connection? Does you
    browsing experience often come to a bitter halt with a message like " Looking for xxx.com...
  9. Has Anyone Seen Any Link-backs As Weird As This ? - (5)
    Today, while analysing my site's referrers, I found three odd domains pointing to a particular
    article on my site ( Chaos Laboratory ). All three domains are running a bulletin board system
    and the links came from a certain post in each. Here are the referring posts:
    http://www.campusblender.com/message_topic.aspx?topic=251569
    http://www.partyeastcarolina.com/message_topic.aspx?topic=251569
    http://www.partyapp.com/message_topic.aspx?topic=251569 What drew my attention to it was the topic
    ID in each link which were 100% identical . So I decided to take a...
  10. Ready Made Websites - (7)
    hello frnds...... we have a wonderfull free hosting facility provided by this astahost ..... i am
    here to host my website which is not yet built (lol)........ i will sure buit it soon
    /biggrin.gif" style="vertical-align:middle" emoid=":D" border="0" alt="biggrin.gif" /> .... but im
    not so good at webdesigning.......can anybody suggest me some websites where i can get ready made
    websites......like ready made garments ready for use...... /laugh.gif"
    style="vertical-align:middle" emoid=":lol:" border="0" alt="laugh.gif" /> ....... or guide me in ur
    own way how to bu...
  11. Sign Up For Microsoft's New Mail - Here's the link. (8)
    Hey guys if you been reading the news, you heard that Microsoft is testing Kahuna, its new AJAX web
    based mail application. It's sort of an Outlook on the browser with a lot of cool features and a
    whole lot of improvement. So yea, Microsoft is testing it right now and you want to be part of it?
    Here's the link I found, not many people know it and others didn't even knew it existed, but
    you sign up here: http://test.msn.ignia.com/minisites/hotmai...px?locale=en-us I already did, I
    hope they contact me soon so I can test Kahuna and be one of the "chosen ones"...
  12. How Can I Include A File In A Html Page ? - a fast changing text in several pages, how can I put it in a file and (11)
    A often-changing text in a static page, or a same set of lines in several pages... How can I include
    a file inside a html page ? #include will probably be a wrong syntax, but... i would have to have
    mything.html which is often changing, and I would like it to be inserted in main.html as well as in
    menus.html and in news.html. Could I insert something like #include mything.html in each page, and
    then, if I want to modify myghing.html the modifications are seen in all the pages where it's
    included ? Or do I ask something stupid ?...
  13. Flash Websites - (13)
    I just have one quick question. I have a Flash website made up already, but it's over 100 mbs.
    Will this be a problem? will it take forever to load up? I've never used a flash webiste, so I
    have no idea how it works. (feel free to call me a noob : ) thanx -Hans...
  14. Making Websites For Companies - (8)
    I've been making sites for groups recently but I offer them free service just because I
    don't know how much to charge them, either by hours or by the size of their site. I've been
    a site designer and flash maker for years now and I make professional look websites and not one of
    those kiddy sites that use only html and have poor layouts. However, I'm new to the site making
    business whatever ucall it and I'm interested in making sites to make money on. So can someone
    help me out wit this, I don't know how much to charge them for my service. I have...
  15. Free Image And Smf Hosting - Link to free image and SMF host. (6)
    You can find a free image host with built in uploader here: Free image host It offers unlimited
    space at the moment. You can also try to get free Simple Machines Forum hosting from the same site:
    SMF Host Register and then follow the instructions in the forums. This site also offers paid SMF
    hosting with higher specifications....
  16. Getting People To Link To You - (3)
    If you want to have people link to your web page but dont know how than you should go to
    www.gotlinks.com. They will give you a list of links to put on your page and when you do a link to
    your site will be put on every one of those pages. This is very helpful....
  17. Anyone Know A Good Link Exchange Program? - (2)
    I've just rebuild my site. And now, I need visitors + members. Do you know any GOOD link
    exchange programs, please tell me. Please just list the programs that you know quite well. Do you
    want me to put a link to your site on my site. If yes, you can reply here. I only accept text link.
    Please be fair, link to my site also....
  18. Pcmag: Top 101 Websites - Wow. (0)
    Yea just as the title says, from PC Magazine a compiled list of top 101 websites. From blogs,
    computing, entertainment to traveling, shopping and career websites, its all here. Check it out you
    can click on each category to bring up the links or you can download directly the 101 favorite file
    so you can have them ready to go on your browser. Enjoy!
    Link:http://www.pcmag.com/category2/0,1874,7488,00.asp...
  19. Websites Creation Record - (7)
    Since the beginig of the year were created 17.5 millions of websites, overwriting the previous
    record called "the bubble" in 2000 where was registed 16 millions of websites. In 1995, existed
    18.9 millions of websites, but then in 2000 the number atchieve 19.8 millions. Now in Octuber 2005
    there are 74.4 millions of websites online. /biggrin.gif' border='0' style='vertical-align:middle'
    alt='biggrin.gif' /> ...
  20. Game Websites Anyone? - (26)
    I know i love games... what about you guys.... I know i love free stuff... what about you guys
    lol... i joined this site called Game Militia last year in june before it launched in July... anyhoo
    its a free site dedicated to people who love like or just play games... plus they have contests for
    all kinds of free stuff... ive won stuff ranging from tshirts to autographed posters to stuff from
    spike tv /smile.gif' border='0' style='vertical-align:middle' alt='smile.gif' /> so check it
    out: www.gamemilitia.com ...
  21. Web-based Instant Messenger - Link to web-based instant messenger. (5)
    Below is a link to a web-based instant messenger that allows you to sign in to several different
    Instant Messaging applications without requiring java or any other special software: Web-Based
    Instant Messenger ...
  22. Testing New Websites Using Different Browsers - Did you wish you had an older browser? (17)
    I was testing a website setup that was working perfect in one browser, when the new version
    (browser) was installed the site looked like 'trash'. The second issue is when I get an
    email complainig that your website don't work in such and such a browser and you wish you had
    that version to test with. Here is a link that I found to a repository of old and new browsers.
    This site include some of the more obscure browsers out there. So if you ever wish you had a
    browser to test your site, here is a link: http://browsers.evolt.org/ /smile.gif' border='0' st...
  23. Help With Background And Text Colors - (8)
    Alright, the question is, what is the easiest combination of background colors to font colors on the
    eyes? (what causes the least amount of strain) A while back I remember reading something that said
    that black text on a white background is harder to read then white text on a black background, and
    when I asked a webmaster friend of mind he said that he prefers black text on grey bg so, assuming
    a webpage that consists solely of colored text and a colored background, what are the best choices?
    white on black? black on white? black on grey? or some other combination? (or...
  24. Unable To See Websites With Mozilla - (1)
    Hi friends, I have downloaded new mozilla fire fox browser and sometimes even though the
    my broadband connection is present,i'm unable to access websites.so what security settings i
    have to make with this browser? Thanks, sunny ...
  25. A Problem With Windows Media Files On Websites - They won't play. (6)
    Recently, my computer stopped playing windows media files that are on web pages. It just shows the
    oldest version of Windows Media Player and the file never plays....
  26. Online Storage? - To hold pictures to link-to (5)
    I'm hoping that someone knows of a EASY to access and use to upload Images and files that are
    link accessable? My main dealings with are Angelfire and Geocicties, Angelfire Does not let you link
    to images at all, and that place has serious pop-ups, Geocities works most of the time, but it has a
    bandwidth thing going on. I have tried other free hosting places, but seemed to be somewhat
    difficult one way or another. I'd Love to be able to just upload to one/two places then link
    to. I've signed up at Gmail, but haven't figured out where the storage part is....



Looking for text, link, rollovers, gerat, effect, websites






*SIMILAR VIDEOS*
Searching Video's for text, link, rollovers, gerat, effect, websites
advertisement




Text Link Rollovers - Gerat effect for your websites



 

 

 

 

ADD REPLY / Got an Opinion! a humble request :-) RAPID SEARCH! Free Hosting [X]
Express your Opinions, Thoughts or Contribute your information that might help someone here.
Ask your Doubts & Queries to get answers.. "Together, We enlight each other!"
Register FREE for AD-FREE forum, Create your own topics, Ask Questions, track topics, setup subscriptions & notifications and Get a Free Website w/ Email and FTP.
500MB Space *No Ads*, CPanel, FTP, PHP, MySQL, EMails - 100% FREE