Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Page 1 of 3 1 2 3 LastLast
Results 1 to 10 of 25
  1. #1
    Junior Member
    Join Date
    Feb 2010
    Posts
    1
    Member #
    21139
    Hello, I could really use some help... I cant figure this out. I used to use Adobe Photoshp and Imageready to make my rollovers, but have recently upgraded to CS$ and am now learning fireworks a bit.

    That said, I have created a menu area with some rollovers. When I use in pages locally on my system, they all work fine. After I upload the site, the rollowvers dont work. The link parts still works, but nothing happens on rollover.

    I have included 2 links for your review:

    http://www.triniticues.com/artheader.html

    This first link is a direct link to the html file that Fireworks created... basically, just the rollover area.

    And here is a link to how that section looks actually implemented into my site:

    http://www.triniticues.com/ilprimo.html


    Of course, these are all live so you cant see the rollover effect, but basically all that is supposed to happen is that the names of the items (illuminati, purple joker, il primo, blackheart, absinthium) is supposed to turn bright yellow when the mouse moves over that particular item....

    I have no idea what is causing this to happen, any help will be greatly appreciated!!

    Thanks!

    Allen

  2.  

  3. #2
    Member
    Join Date
    Jan 2010
    Posts
    40
    Member #
    20832
    Rollovers like these are extremely hard to edit afterwards. I recommend using the sliding doors technique and doing this yourself. I've written a tutorial about making buttons/other interactive objects change background on hover while still using 1 image, so you might want check that tutorial here:http://tutoriary.com/html-css/shifti...h-one-image-2/

  4. #3
    Senior Member Dorky's Avatar
    Join Date
    Jun 2009
    Location
    Destin Florida
    Posts
    1,430
    Member #
    19103
    Liked
    4 times
    idk, i didnt see anything unusual. i dont use any of that stuff and javscript is way overkill for that effect. why not just use css :hover instead.

    while($get_it !== true){ continue; }

  5. #4
    Senior Member Dorky's Avatar
    Join Date
    Jun 2009
    Location
    Destin Florida
    Posts
    1,430
    Member #
    19103
    Liked
    4 times
    Rollovers like these are extremely hard to edit afterwards. I recommend using the sliding doors technique and doing this yourself. I've written a tutorial about making buttons/other interactive objects change background on hover while still using 1 image, so you might want check that tutorial here:http://tutoriary.com/html-css/shifti...h-one-image-2/
    this is like builing a car to go 3 mph, pointless. its just an image swap. not only are all of these methods overkill but add to your load time. css really isnt that hard.

    while($get_it !== true){ continue; }

  6. #5
    Senior Member aeroweb99's Avatar
    Join Date
    Feb 2008
    Location
    Port Huron, Michigan
    Posts
    1,037
    Member #
    16468
    Liked
    1 times
    Quote Originally Posted by Dorky
    this is like builing a car to go 3 mph, pointless. its just an image swap. not only are all of these methods overkill but add to your load time. css really isnt that hard.
    Image shift is css. It just moves the bg image so it looks like an image swap. The only problem with that technique is, if the user bumps the text size up, then it can reeeaaallly look bad. I'm sure there's a way to avoid that but I have not used them, so I have not researched it much.

  7. #6
    Senior Member Dorky's Avatar
    Join Date
    Jun 2009
    Location
    Destin Florida
    Posts
    1,430
    Member #
    19103
    Liked
    4 times
    unless css was designed without the ability to scale.... oh, wait. thats EXACTLY what css is for. aero that statement is total bunk. css :hover is used all over the net for link image effects. in fact that is one of its primary purposes.

    while($get_it !== true){ continue; }

  8. #7
    Senior Member Dorky's Avatar
    Join Date
    Jun 2009
    Location
    Destin Florida
    Posts
    1,430
    Member #
    19103
    Liked
    4 times
    css hover is used improperly by some to shift the image position with a dual sided image. this is bad practice and the only way to recreate the issue pointed out by aero.

    a { background: url(http://whatever.com/images/whatever1.jpg); }
    a:hover { background: url(http://whatever.com/images/whatever2.jpg); }

    is the proper usage for image change with css. check your w3 standards.

    while($get_it !== true){ continue; }

  9. #8
    Senior Member aeroweb99's Avatar
    Join Date
    Feb 2008
    Location
    Port Huron, Michigan
    Posts
    1,037
    Member #
    16468
    Liked
    1 times
    Quote Originally Posted by Dorky
    unless css was designed without the ability to scale.... oh, wait. thats EXACTLY what css is for. aero that statement is total bunk. css :hover is used all over the net for link image effects. in fact that is one of its primary purposes.
    What do you mean my statement is bunk? I'm confused. I'm saying the image shift is css made, by shifting the bg image position on hover. All I said was that I don't think it's reliable when sizing text, but I have not researched it enough to know for sure. And yes, I would use the method you posted. So wtf!

  10. #9
    Senior Member Dorky's Avatar
    Join Date
    Jun 2009
    Location
    Destin Florida
    Posts
    1,430
    Member #
    19103
    Liked
    4 times
    Image shift is css. It just moves the bg image so it looks like an image swap. The only problem with that technique is, if the user bumps the text size up, then it can reeeaaallly look bad
    this looked a lot like a contradiction to the effective use of css :hover. sorry if i misunderstood.

    if you use a dual sided image and just shift the position then it is true when you scale you will see the unintended portion of the image. regardless of css or js if you scale just the text all images will become misaligned as resizing text is just that "text" and will effect everything on the site. most seniors or anyone with vision issues scale the entire page not just text because of this.

    didnt intend to come off as harsh as i probably did. i have a hard time with being contradicted as i personally try to avoid doing so to others unless they are intentionally or otherwise handing off misinformation. typically i just post my own suggestion and allow the person posting a question to decide on the solution.

    while($get_it !== true){ continue; }

  11. #10
    Senior Member aeroweb99's Avatar
    Join Date
    Feb 2008
    Location
    Port Huron, Michigan
    Posts
    1,037
    Member #
    16468
    Liked
    1 times
    Quote Originally Posted by Dorky

    didnt intend to come off as harsh as i probably did. i have a hard time with being contradicted as i personally try to avoid doing so to others unless they are intentionally or otherwise handing off misinformation.
    No worries, I kinda know your style, so I knew the "wtf" wouldn't rile you up too much.

    The image shift technique was designed so there was no delay of the hover image if it was not preloaded. That's another thread, preloading images.

    btw, did you see my possum? :-p


Page 1 of 3 1 2 3 LastLast

Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 12:15 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com