treehouse : what would you like to learn today?
Web Design Web Development iOS Development

Video pop up to play as cursor hover text

  • Hey anyone,

    I want to have a video to pop up and play in small 200x200 (not exact size) and play instantly as cursor hovers over text. I don't want it to disappear if cursor moves away from text, unless video is clicked to stop. This would be a video presentation of a product.

    Also can a link be set in a (hover over text) pop up box with a link that will be able to clicked inside the box? Does that make sense?

    Both these in a Wordpress theme.

    Ive been in a search for days. I have a hover text that pops an image and was able to put a [video] player in it, but screen is black and loading circles.

    Thanks for any help

  • Hi,

    Can u show me your code?

  • I placed this in single post and pages

    .gallerycontainer{ position: relative; /Add a height attribute and set to largest image's height to prevent overlaying/ }

    .thumbnail img{ border: 1px solid white; margin: 0 5px 5px 0; }

    .thumbnail:hover{ background-color: transparent; }

    .thumbnail:hover img{ border: 1px solid blue; }

    .thumbnail span{ /CSS for enlarged image/ position: absolute; background-color: lightyellow; padding: 5px; left: -1000px; border: 1px dashed gray; visibility: hidden; color: black; text-decoration: none; }

    .thumbnail span img{ /CSS for enlarged image/ border-width: 0; padding: 2px; }

    .thumbnail:hover span{ /CSS for enlarged image/ visibility: visible; top: 0; left: 230px; /*position where enlarged image should offset horizontally */ z-index: 50; }

    ** Use this in Post**

    textimage
    text