|
 |
|
|
|
| Thread title: Roll overs and image replacements |
 |
|
|
| |
|
Thread tools
Search this thread
Display Modes
|
|
|
09-20-2006, 05:39 AM
|
#11
|
Status: Request a custom title
Join date: Dec 2005
Location: Colchester, UK
Expertise:
Software:
Posts: 4,625
|
I will always go with a CSS solution, using unordered lists - For SEO and accessibility purposes.
|
|
|
|
09-20-2006, 03:21 PM
|
#12
|
Status: Request a custom title
Join date: Dec 2005
Location: Arizona
Expertise:
Software:
Posts: 5,200
|
Yes, the only thing I hate with using :hover in CSS, is that IE only supports :hover on anchors.  My solution is great though, never has to reload, and is super fast. 
|
|
|
|
09-20-2006, 04:32 PM
|
#13
|
Status: Narassist
Join date: May 2005
Location: USA
Expertise:
Software:
Posts: 4,469
|
Allright Folks,
What I was originally asking was, there are different modes of doing these two effects. I was curious of what your method was, ie misalign or hidden, etc, and maybe a sample link or code.
|
|
|
|
09-20-2006, 05:02 PM
|
#14
|
Status: Lewis Ainslie
Join date: Dec 2005
Location: UK, England.
Expertise:
Software:
Posts: 1,630
|
|
Originally Posted by Bennett
What I was originally asking was, there are different modes of doing these two effects. I was curious of what your method was, ie misalign or hidden, etc, and maybe a sample link or code.
|
Does it have to be CSS? 
|
|
|
|
09-20-2006, 08:58 PM
|
#15
|
Status: Member
Join date: Sep 2006
Location: New York City
Expertise:
Software:
Posts: 230
|
You asked which method we think is the best. We gave you an answer.
What's the problem?
|
|
|
|
09-21-2006, 05:23 AM
|
#16
|
Status: Narassist
Join date: May 2005
Location: USA
Expertise:
Software:
Posts: 4,469
|
|
Originally Posted by EEight
You asked which method we think is the best. We gave you an answer.
What's the problem?
|
I was asking WHICH method. There are different METHODS for doing both in BOTH mediums. Then asked for some source information.
That is the problem.
You were the only one to answer the question, as well as andrew was trying to.
|
|
|
|
09-21-2006, 05:56 AM
|
#17
|
Status: Pastafarian
Join date: May 2006
Location: Duct Taped to your Ceiling
Expertise:
Software:
Posts: 3,440
|
Ok, hows this?
I use CSS for my rollovers - never javascript anymore. But none of those crappy ways that leave a bit of lag while the mouse over loads - mine are offset tabs.
The code below I quickly harvested from the original HostSly.com theme I made for WP... should work after a copy/paste/save though.
Here is the css code
Code:
#tabnav {
float:left;
margin:0;
padding: 0px;
width:100%;
font-size:93%;
line-height:normal;
}
#tabnav ul {
margin:0;
padding:0px;
list-style:none;
}
#tabnav li {
display:inline;
margin:0;
padding:0;
}
#tabnav a {
float:left;
background:url(img/tableft.gif) no-repeat left top;
margin:0;
margin-right: 7px;
padding:0 0 0 4px;
text-decoration:none;
}
#tabnav a span {
float:left;
display:block;
background:url(img/tabright.gif) no-repeat right top;
padding:12px 15px 8px 11px;
color:#FFF;
}
/* hax for the mac ie \*/
#tabs6 a span {float:none;}
/*end hax for the mac ie */
#tabs6 a:hover span {
color:#FFF;
}
#tabnav a:hover {
background-position:0% -33px;
}
#tabnav a:hover span {
background-position:100% -33px;
}
#tabnav #current a {
background-position:0% -33px;
}
#tabnav #current a span {
background-position:100% -33px;
}
Here is the HTML
Code:
<!-- Navigation Tabs -->
<div id="tabnav">
<ul>
<li><a href="http://hostsly.com"><span>Home</span></a></li>
<li><a href="http://hostsly.com/reviews/tips/"><span>Tips</span></a></li>
<li><a href="http://hostsly.com/forums/"><span>Forums</span></a></li>
<li><a href="http://hostsly.com/about/"><span>About</span></a></li>
<li><a href="http://hostsly.com/contact/"><span>Contact</span></a></li>
<li><a href="http://hostsly.com/advertise/"><span>Advertise</span></a></li>
</ul>
</div>
<!-- End Navigation Tabs -->
And the images I use are attached.
Hope that helps. I'm not sure who first hooked my up with this style of doing it, but thanks - I've been using it for a long time now
|
|
|
|
09-21-2006, 06:05 AM
|
#18
|
Status: Pastafarian
Join date: May 2006
Location: Duct Taped to your Ceiling
Expertise:
Software:
Posts: 3,440
|
Actually, those images are / were the wrong ones, no change in color. I fixed them, and also put together a working example. Should be attached. Works a friggin charm.
For those of you to lazy to download and extract, a working example: http://slybynight.com/rolloverexample/
Edit: Oops. never updated the links, they still lead to HostSly.com pages. Ohwell, your example is working anyways.
|
|
|
|
09-21-2006, 12:28 PM
|
#19
|
Status: Narassist
Join date: May 2005
Location: USA
Expertise:
Software:
Posts: 4,469
|
Thank you much, exactly the kind of response I was looking for.
Anyone else have an opinion on what they feel is the best method for either of these?
And kind of curious, not having much luck finding information on it, but do phones / pdas / wap enabled devices have the ability to render CSS?
|
|
|
|
09-21-2006, 03:07 PM
|
#20
|
Status: Request a custom title
Join date: Dec 2005
Location: Arizona
Expertise:
Software:
Posts: 5,200
|
I'm 100% sure PSP's do, not sure about phones or not.. PDAs are a possibility.
|
|
|
|
|
|
|
|
|
|
Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
|
|
|
|
|
Linear Mode
Forum Contains New Posts 
Forum Contains No New Posts 
Forum is Closed