SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Member
    Join Date
    Sep 2008
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Image Roll Over Help

    Hey everyone,

    Just started putting a website together for a friend and have included some roll over images for the navigation.

    The top row is working fine the the bottom row has a sort of half shadow effect in IE & Safari. The site looks fine in FF.

    Any ideas?

    The site is edgetoedgedesign.com/new.html

    Thanks

  2. #2
    doing my best to help c2uk's Avatar
    Join Date
    May 2005
    Location
    Cardiff
    Posts
    1,832
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    please look into CSS image replacement methods, using javascript for this is ugly and not recommended.
    Dan G
    Marketing Strategist & Consultant

  3. #3
    SitePoint Wizard bronze trophy Black Max's Avatar
    Join Date
    Apr 2007
    Posts
    4,029
    Mentioned
    12 Post(s)
    Tagged
    0 Thread(s)
    Looks very strange in Opera. I really wouldn't do it that way, you have a morass of JS in your code that you could easily replicate with basic CSS hover attributes. Welcome to SP, Steve!

  4. #4
    SitePoint Member
    Join Date
    Sep 2008
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks guys,

    Any suggestions on how to do this, I am using two images due to the font being a self created one. I don't want to replace the font although I understand that would be a better option for many reasons.

    Any help would be greatly appreciated.

    I will also be looking for some help with the next step, to have 6 images displayed on the front page but these be randomly grabbed from a pool of about 18? What should I be looking at here. does this have to be some sort of script?

  5. #5
    doing my best to help c2uk's Avatar
    Join Date
    May 2005
    Location
    Cardiff
    Posts
    1,832
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    1. simple css, different background images for normal state and :hover - tutorials on how to do this can be found here: http://css.maxdesign.com.au/ (not all use that technique, you'd have to check each single one to find the one that comes closest to what you want)

    2. yes, you'd need a script, you can choose between a server side script using php (or another server side programming language) or client side JavaScript - maybe one of the JavaScript libraries has something like this but I'd advise against using client side.
    Dan G
    Marketing Strategist & Consultant

  6. #6
    SitePoint Addict AtSea webdesign's Avatar
    Join Date
    May 2010
    Location
    Newark, Delaware
    Posts
    283
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    A List Apart has a good article on how to use CSS sprites.
    http://www.alistapart.com/articles/sprites

    If that doesn't work google "CSS sprites".

    There are hundreds of random scripts out there. The last site I created I used a database of images and displayed them randomly on the page with php.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •