Today's Posts Follow Us On Twitter! TFL Members on Twitter  
Forum search: Advanced Search  
Navigation
Marketplace
  Members Login:
Lost password?
  Forum Statistics:
Forum Members: 24,254
Total Threads: 80,792
Total Posts: 566,472
There are 1950 users currently browsing (tf).
 
  Our Partners:
 
  TalkFreelance     Design and Development     HTML/XHTML/DHTML/CSS :

How to do this hover effect?

Thread title: How to do this hover effect?
Closed Thread    
    Thread tools Search this thread Display Modes  
11-23-2005, 10:22 PM
#1
Yang is offline Yang
Yang's Avatar
Status: Member
Join date: Jun 2005
Location:
Expertise:
Software:
 
Posts: 460
iTrader: 0 / 0%
 

Yang is on a distinguished road

Send a message via Yahoo to Yang

  Old  How to do this hover effect?

Hey, I was browsing and found this website (http://www.lealea.net/) with a cool hover effect on it's top, centered, horizontal navigation. As you hover, there's an arrow like shape cut off of the button. Yea yea, I've seen this around, but never got around to ask someone. Is it an image?

11-23-2005, 10:30 PM
#2
Jhin is offline Jhin
Jhin's Avatar
Status: Member
Join date: Nov 2005
Location: Ontario, Canada
Expertise:
Software:
 
Posts: 303
iTrader: 0 / 0%
 

Jhin is on a distinguished road

Send a message via ICQ to Jhin Send a message via AIM to Jhin Send a message via MSN to Jhin Send a message via Yahoo to Jhin

  Old

The main links have this code on them:

Code:
ul#minitabs a {
	float: left;
	text-decoration: none;
	padding: 6px 0 9px;
	color: #eee;
	text-align: center;
        background-color:transparent;
}
Then the hover has this:

Code:
ul#minitabs a:hover {
	color: #fff;
	background: transparent url(/images/triangle.gif) no-repeat center bottom;
}
the gif, which is just a transparent gif with a black triangle, appears on the bottom center of the menu. The menu itself is sitting over the magenta coloured graphic, and is a horizontal list.

Check out css.maxdesign listomatic

11-23-2005, 11:58 PM
#3
Mr. Cheeky is offline Mr. Cheeky
Status: I love this place
Join date: May 2005
Location:
Expertise:
Software:
 
Posts: 739
iTrader: 0 / 0%
 

Mr. Cheeky is on a distinguished road

  Old

Originally Posted by Jhin
Thats a great link, thanks!

11-24-2005, 12:02 AM
#4
Jhin is offline Jhin
Jhin's Avatar
Status: Member
Join date: Nov 2005
Location: Ontario, Canada
Expertise:
Software:
 
Posts: 303
iTrader: 0 / 0%
 

Jhin is on a distinguished road

Send a message via ICQ to Jhin Send a message via AIM to Jhin Send a message via MSN to Jhin Send a message via Yahoo to Jhin

  Old

My pleasure...they've got some great tutorials on there

11-24-2005, 12:20 AM
#5
Yang is offline Yang
Yang's Avatar
Status: Member
Join date: Jun 2005
Location:
Expertise:
Software:
 
Posts: 460
iTrader: 0 / 0%
 

Yang is on a distinguished road

Send a message via Yahoo to Yang

  Old

Hey great, thanks for clearing that up.

12-09-2005, 01:08 AM
#6
Zack is offline Zack
Status: I love this place
Join date: Dec 2005
Location: US and A
Expertise:
Software:
 
Posts: 595
iTrader: 2 / 100%
 

Zack is on a distinguished road

  Old

Thank you, I was looking for something similar to my site. Thank you very much.
BigZ

Closed Thread    


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 

  Posting Rules  
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump:
 
  Contains New Posts Forum Contains New Posts   Contains No New Posts Forum Contains No New Posts   A Closed Forum Forum is Closed