SitePoint Sponsor

User Tag List

Results 1 to 10 of 10

Thread: Image Rollovers

  1. #1
    SitePoint Zealot
    Join Date
    Jan 2002
    Posts
    153
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Image Rollovers

    I'm about to do some image rollovers, which I haven't done in a while, and I was wondering if javascript is still the common way to do them, or if there is a faster (loading, not faster to code) method now.


  2. #2
    SitePoint Wizard
    Join Date
    Oct 2001
    Location
    Tucson, Arizona
    Posts
    1,858
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    JavaScript is still the best (and easiest) way to do image rollovers.

  3. #3
    SitePoint Member
    Join Date
    Jun 2002
    Location
    Michigan
    Posts
    11
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    DHTML also has a nice simple way to do rollovers, and personally, I think DHTML runs a bit more smoothly than Javascript..

  4. #4
    . Ruchir's Avatar
    Join Date
    Feb 2002
    Location
    Sydney
    Posts
    1,863
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    i prefer JavaScript for rollovers !!
    Peace.

  5. #5
    SitePoint Wizard Bill Posters's Avatar
    Join Date
    Dec 2001
    Location
    UK
    Posts
    1,523
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by AFSD-Nicole
    DHTML also has a nice simple way to do rollovers, and personally, I think DHTML runs a bit more smoothly than Javascript..
    Not bad considering that DHTML runs on javascript

    DHTML is simply using javascript to dynamically control certain elements of CSS/HTML.
    New Plastic Arts: Visual Communication | DesignateOnline

    Mate went to NY and all he got me was this lousy signature

  6. #6
    SitePoint Wizard creole's Avatar
    Join Date
    Oct 2000
    Location
    Nashvegas Baby!
    Posts
    7,845
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Adobe Certified Coldfusion MX 7 Developer
    Adobe Certified Advanced Coldfusion MX Developer
    My Blog (new) | My Family | My Freelance | My Recipes

  7. #7
    Grumpy Mole Man Skunk's Avatar
    Join Date
    Jan 2001
    Location
    Lawrence, Kansas
    Posts
    2,066
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    DHTML = what happens when you combine Javascript, HTML, CSS and the DOM in order to create "dynamic" effects on web pages such as animations and thigns that change in response to user actions. It's just a buzzwordy name for a combination of technologies.

  8. #8
    SitePoint Wizard
    Join Date
    Oct 2001
    Location
    Tucson, Arizona
    Posts
    1,858
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by AFSD-Nicole
    I think DHTML runs a bit more smoothly than Javascript..
    Care to give us examples showing the differences between, say, an image rollover in "DHTML," versus one in JavaScript?

  9. #9
    SitePoint Wizard silver trophy TheOriginalH's Avatar
    Join Date
    Aug 2000
    Location
    Thailand
    Posts
    4,810
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    A quicker (and IMO cleaner) way of doing button rollovers is to have the buttons themselves as background in a table cell, and just have the text chage css stylee. Doesn't work if you want to have "depressed" (.. ) buttons, but if it's just text changing colour (as is often the case), saves on graphics load time...
    ~The Artist Latterly Known as Crazy Hamster~
    922ee590a26bd62eb9b33cf2877a00df
    Currently delving into Django, GIT & CentOS

  10. #10
    SitePoint Enthusiast
    Join Date
    Jun 2002
    Posts
    69
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    depending on what you want to do... you could try changing the borders with a hover...

    a.nonImage {
    background-color: #e9e;
    border: 1px solid #d0d;
    color: #000;
    font-family: verdana;
    font-size: 10px;
    left: 0px;
    margin: 2px;
    padding: 2px 4px 2px 4px;
    text-decoration: none;
    }
    a.nonImage:hover {
    background-color: #e9e;
    border-color: #f0f #909 #909 #f0f;
    color: #000;
    }

    of course our old friend ns4.x will choke on this one....


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
  •