Video Hover Play - Probably could be more elegant...

magical.css

/* Make Container Relative */
.video-wrapper {
    position: relative;
}

/* Position the pause/play buttons in corner */
.video-icon-item {
    font-family: "FontAwesome"; /* Font Awesome HTML Entity Trick verus using <i class="fa fa-play"></i> */
    position: absolute;
    right: 20px;
    bottom: 20px;
    display: block;
    color: #fff;
    font-size: 18px;
    width: 50px;
    height: 50px;
    text-align: center;
    line-height: 47px;
    -moz-transition: all 250ms ease-in-out;
    -webkit-transition: all 250ms ease-in-out;
    transition: all 250ms ease-in-out;
}

/* Hide "Play" by default */
.video-icon-item .play {
    display: none;
}

/* Spin icon to make it look like something is happening */
video:hover ~ .video-icon-item {
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
}

/* Show "Play" on hover (CSS only woooo) */
video:hover ~ .video-icon-item .play {
    display: block;
}
/* Hide "Pause" on hover (CSS only woooo) */
video:hover ~ .video-icon-item .pause {
    display: none;
}

power.js

$(function() {
  // Full screen videos
	$('video').click(function() {
		var video = $(this).get(0);

        // Full screen videos
		if (video.requestFullscreen) {
			video.requestFullscreen();
		} else if (video.msRequestFullscreen) {
			video.msRequestFullscreen();
		} else if (video.mozRequestFullScreen) {
			video.mozRequestFullScreen();
		} else if (video.webkitRequestFullscreen) {
			video.webkitRequestFullscreen();
		}
	});
	
	// Pause/Play Hover
	$('video').hover(function(){
		$(this).get(0).play();
	}, function(){
		$(this).get(0).pause();
	});
});

video.html

<div class="video-wrapper">
    <video loop muted="muted">
        <source src="https://s3.amazonaws.com/scotchio/atom/commandp.m4v" type="video/mp4">
        <source src="https://s3.amazonaws.com/scotchio/atom/commandp.webm" type="video/webm">
    </video>
    <div class="video-icon-item">
        <span class="pause">&#xf04c;</span>
        <span class="play">&#xf04b;</span>
    </div>
</div>