Hello and welcome to our community! Is this your first visit?
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New Coder
    Join Date
    Feb 2011
    Thanked 0 Times in 0 Posts

    Question Onmouseover Image/Text Glide

    Hello all,

    I'm new to this forum so please forgive me if I make mistakes and feel free to point them out.

    I'm a beginner when it comes to javascript, but would like to learn. I have been building a website that I would like to put an interactive feature on.

    This is the code that I currently have:

    <a href="javascript:void(0)" onclick="changeImg(white, 'images/Bouquet_pink.jpg')" onmouseover="scroll_up();"><img class="pinkico" hspace="3" onMouseover="this.style.opacity=1;this.filters.alpha.opacity=100;" onMouseout="this.style.opacity=0.5;this.filters.alpha.opacity=50;" src="images/Bouquet_pink_icon.jpg">
    <a href="javascript:void(0)" onclick="changeImg(white, 'images/Bouquet_yellow.jpg')"><img class="yellowico" hspace="4" onMouseOver="this.style.opacity=1;this.filters.alpha.opacity=100;" onMouseout="this.style.opacity=0.5;this.filters.alpha.opacity=50;" src="images/Bouquet_yellow_icon.jpg">
    <a href="javascript:void(0)" onclick="changeImg(white, 'images/Bouquet_white.jpg')"><img class="whiteico" onMouseover="this.style.opacity=1;this.filters.alpha.opacity=100;" onMouseout="this.style.opacity=0.5;this.filters.alpha.opacity=50;" src="images/Bouquet_white_icon.jpg" ></a>
    I would like to have these images scroll together at the same time in accordance with the mouse movement. So when the mouse is just hovering over one of these images or elsewhere on my page they will stay still, but when the mouse is hovered over the left or the right hand side the images move in that direction? So if the mouse is hovering over to the left side the images will start to slide left and if the mouse is hovering over the right side the images will start to slide right.

    I have tried to do some research on this for myself but have only been able to locate this web page to explain what I am looking for:
    Link 1 - The type of effect I'm looking for is demonstrated by their first example, underneath the horizontal scrolling demo header.

    I have no idea how to achieve this code though and have failed to find any answers that I understand on the website. Adding two little arrow images for the mouseover and mouseout effect to happen would not be a problem, but I do not understand how to go about this.

    Hope this is ok,

    Thank you for reading ,


  2. #2
    New to the CF scene
    Join Date
    Dec 2011
    Thanked 0 Times in 0 Posts
    I think FlowSlider plugin may help you.


Tags for this Thread

Posting Permissions

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