0

Say i have a html5 vedio with mouse hovering of pausing and running in relation to cursor and code is working finely.I useing code as: from.js:

// something along that
var vid = document.getElementsByTagName("video");
[].forEach.call(vid, function (item) {
    item.addEventListener('mouseover', hoverVideo, false);
    item.addEventListener('mouseout', hideVideo, false);
});

function hoverVideo(e)
{  
    this.play();
}
function hideVideo(e)
{
    this.pause();

And index.html page:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Horizontal_Slider</title>
<link href="css/style.css" rel="stylesheet" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
<link href='http://fonts.googleapis.com/css?family=Asap' rel='stylesheet'
type='text/css'>
<script type="text/javascript">
Shadowbox.init();
</script>
</head>
<body>
<div id="video_container">
<div id="video_container">
<video id="video" width="480" height="270" controls autoplay
autobuffer   preload="metadata">
<source src="video/browser.mp4"  type='video/mp4; codecs="avc1.42E01E, 
mp4a.40.2"'>
</source>
<source src="video/browser.ogv"  type='video/ogg; codecs="theora, vorbis"'></source>
Your browser does not support the video element.
</video><br/>
<div id="video_container">
<video id="video" width="480" height="270" controls 
autoplay autobuffer preload="metadata">
<source src="video/browser.mp4"  type='video/mp4; codecs="avc1.42E01E, 
mp4a.40.2"'></source>
<source src="video/browser.ogv"  type='video/ogg; codecs="theora, vorbis"'></source>
Your browser does not support the video element.
</video><br/>
<script src="js/from.js"></script>
<script>
document.addEventListener('mouseover',hoverVideo,false);
var vid = document.getElementById('video2')
function hoverVideo(e)
{  
if(e.target == vid)
{
vid.play();
this.addEventListener('mouseout',hideVideo,false);
}
}

function hideVideo(e)
{
    if(e.target == vid)
    {
        vid.pause();
    }

}

</script>
</body>
</html>

But i am want that a square should appear on vedio particulary showing face or just a square in vedio on mouse entering and removing square on leaving??I am new to this and no idea how to do.Please help.I have imagined how square will show on vedios.Look at http://imgur.com/LjioiAd.It is not compulsory suare must be on face,it can be anywhere.But if in a face then more useful.Pleasesupport or suggest any help

2
Contributors
1
Reply
27
Views
2 Years
Discussion Span
Last Post by gabrielcastillo
This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.