鼠标滑移视频播放代码 video hover play

设计

<video muted id="video1" onmouseover="this.play()" onmouseout="this.pause()">
<source src="https://www.hohem-tech.com/wp-content/uploads/2019/04/%E5%AE%9A%E7%82%B9%E5%BB%B6%E6%97%B6%E6%91%84%E5%BD%B1720HD.mp4" type="video/mp4">
<source src="mov_bbb.ogg" type="video/ogg">
Your browser does not support HTML5 video.
</video>



// Mouseover/ Click sound effect- by JavaScript Kit (www.javascriptkit.com)
// Visit JavaScript Kit at http://www.javascriptkit.com/ for full source code
//** Usage: Instantiate script by calling: var uniquevar=createsoundbite("soundfile1", "fallbackfile2", "fallebacksound3", etc)
//** Call: uniquevar.playclip() to play sound




var html5_audiotypes={ //define list of audio file extensions and their associated audio types. Add to it if your specified audio file isn't on this list:

	"mp3": "audio/mpeg",

	"mp4": "audio/mp4",

	"ogg": "audio/ogg",

	"wav": "audio/wav"

}




function createsoundbite(sound){

	var html5audio=document.createElement('audio')

	if (html5audio.canPlayType){ //check support for HTML5 audio

		for (var i=0; i<arguments.length; i++){

			var sourceel=document.createElement('source')

			sourceel.setAttribute('src', arguments[i])

			if (arguments[i].match(/\.(\w+)$/i))

				sourceel.setAttribute('type', html5_audiotypes[RegExp.$1])

			html5audio.appendChild(sourceel)

		}

		  html5audio.load()

		  html5audio.playclip=function(){

			html5audio.pause()

			html5audio.currentTime=0

			html5audio.play()

		}

		return html5audio

	}

	else{

		return {playclip:function(){throw new Error("Your browser doesn't support HTML5 audio unfortunately")}}

	}

}




Previous Post
网站看起来高大上的秘密
Next Post
近期完工+网站收集整理

相关文章

Menu