Hey Mark! Thanks for taking the time to respond! That is a great way to do it. I am learning jquery so I wanted to see how to do it in jquery. As you can see im having a tough time with it lol.
thanks for the feedback though Glen On Jan 7, 9:53 pm, Mark Kelly <wastedti...@gmail.com> wrote: > Hi Glen. > > I'm late to the thread (and this is probably a bit off-topic for this list) > but up until the point where you asked for the cross-fade, everything you need > can be done with vanilla CSS, no need to involve jquery at all. > > In the page: > > <a class="available-button" href="whatever.php"> > Currently accepting new jobs > </a> > > In the CSS: > > div#availibilty a.available-button { > display: block; > float: right; > width: 169px; > height: 222px; > border: none; > background: url('images/avail.png) top left no-repeat; > text-indent: -3000px; > > } > > div#availibilty a.available-button:hover { > background: url('images/availhover.png) top left no-repeat; > > } > > I put up the example above using your images: > > http://b.ite.me.uk/css_demo.html > > One advantage to this is that it works in browsers that have javascript turned > off, and also that screen readers etc. will still see the link as text (try > looking at it in Firefox with styles turned off to get an idea what a screen > reader sees). Improved accessibility is always a good thing. > > Hope this helps, if not for this (CSS can't do you a cross-fade) then maybe > other projects, > > Mark