placing two images one in front and one behind

Discussion in 'HTML' started by Nospam, Mar 22, 2007.

  1. Nospam

    Nospam Guest

    does anyone have an example with css where two images are placed one in
    front of the other?
     
    Nospam, Mar 22, 2007
    #1
    1. Advertising

  2. Nospam wrote:
    > does anyone have an example with css where two images are placed one in
    > front of the other?
    >
    >

    Do you mean by front an overlay? If so the image rollovers that I did on
    this page is via CSS instead of traditional JavaScript.

    http://www.littleworksstudio.com/Amberlithe/articles/2
    Article: Finer points: What's a Rhomboid? - Amberlithe Ibizan Hounds

    That is a dynamic example, but it is not too difficult to statically
    position one element over top of another with 'position: absolute;'...
    More info would help.

    --
    Take care,

    Jonathan
    -------------------
    LITTLE WORKS STUDIO
    http://www.LittleWorksStudio.com
     
    Jonathan N. Little, Mar 22, 2007
    #2
    1. Advertising

  3. Nospam

    dorayme Guest

    In article <ad6e9$4601f36e$40cba7c1$>,
    "Jonathan N. Little" <> wrote:

    > http://www.littleworksstudio.com/Amberlithe/articles/2


    Interesting, Jonathan, I wish the diagrams and text (eg. on the
    ears) would stay put till I moved mouse off and not keep looping
    (disappearing and reappearing). Safari.

    --
    dorayme
     
    dorayme, Mar 22, 2007
    #3
  4. dorayme wrote:
    > In article <ad6e9$4601f36e$40cba7c1$>,
    > "Jonathan N. Little" <> wrote:
    >
    >> http://www.littleworksstudio.com/Amberlithe/articles/2

    >
    > Interesting, Jonathan, I wish the diagrams and text (eg. on the
    > ears) would stay put till I moved mouse off and not keep looping
    > (disappearing and reappearing). Safari.
    >


    Should, it is an animated GIF cycling though the different points. Flash
    would be a better solution, just having gotten around with learning Flash.

    --
    Take care,

    Jonathan
    -------------------
    LITTLE WORKS STUDIO
    http://www.LittleWorksStudio.com
     
    Jonathan N. Little, Mar 22, 2007
    #4
  5. Nospam

    dorayme Guest

    In article <f31a4$4602f331$40cba7b1$>,
    "Jonathan N. Little" <> wrote:

    > http://www.littleworksstudio.com/Amberlithe/articles/2


    In iCab it stays put after the various stages are unfolded. But
    not on my FF or Safari.

    To be clear, in Safari and FF on Mac it does this: move mouse to
    left dog's left ear and red triangle appears, then word/graphic
    Rhomboid, then .., then without touching mouse, leaving it on
    ear, the whole "rollover" disappears and loops through again.

    More pleasingly, in iCab it stays completed. Moving mouse away,
    it goes but returns (completed, not in stages) on hover again.

    Curiously, on refresh (reload url) in iCab, the rollover fails to
    work at all.

    --
    dorayme
     
    dorayme, Mar 22, 2007
    #5
  6. dorayme wrote:
    > In article <f31a4$4602f331$40cba7b1$>,
    > "Jonathan N. Little" <> wrote:
    >
    >> http://www.littleworksstudio.com/Amberlithe/articles/2

    >
    > In iCab it stays put after the various stages are unfolded. But
    > not on my FF or Safari.
    >
    > To be clear, in Safari and FF on Mac it does this: move mouse to
    > left dog's left ear and red triangle appears, then word/graphic
    > Rhomboid, then .., then without touching mouse, leaving it on
    > ear, the whole "rollover" disappears and loops through again.
    >
    > More pleasingly, in iCab it stays completed. Moving mouse away,
    > it goes but returns (completed, not in stages) on hover again.
    >
    > Curiously, on refresh (reload url) in iCab, the rollover fails to
    > work at all.
    >


    Maybe your iCab is set to limit the number of reps for animated GIFs.
    Many browser have that setting.

    It is a kludge as I said, better served as Flash. The GIF does not
    reload as with JavaScript methods I am just moving it "off stage" when
    not hovered so if hover while the animation is in the middle of the
    cycle, well it is less than perfect...

    --
    Take care,

    Jonathan
    -------------------
    LITTLE WORKS STUDIO
    http://www.LittleWorksStudio.com
     
    Jonathan N. Little, Mar 22, 2007
    #6
  7. Nospam

    Bergamot Guest

    Jonathan N. Little wrote:
    >>
    >>> http://www.littleworksstudio.com/Amberlithe/articles/2

    >
    > it is an animated GIF


    Ah, that explains why nothing much happened when I put the cursor over
    the dog pictures. I disabled animations in my browser. It was a little
    confusing to see the cursor change to help (?) but nothing else.

    --
    Berg
     
    Bergamot, Mar 23, 2007
    #7
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Alan Silver
    Replies:
    9
    Views:
    552
    Teemu Keiski
    Mar 9, 2006
  2. Dave Kelly
    Replies:
    10
    Views:
    584
    Dave Kelly
    Jul 10, 2006
  3. Scott
    Replies:
    4
    Views:
    1,392
    Gus Richter
    Feb 27, 2010
  4. Replies:
    1
    Views:
    140
    Nathan Sokalski
    May 2, 2006
  5. Dung Ping
    Replies:
    1
    Views:
    140
    Randy Webb
    Feb 27, 2005
Loading...

Share This Page