xj / yii2-jquery-eraser
yii2-jquery-eraser
1.0.0
2015-10-08 04:44 UTC
Requires
- bower-asset/jquery-eraser: ~0.5
This package is auto-updated.
Last update: 2024-10-10 20:34:26 UTC
README
https://github.com/boblemarin/jQuery.eraser
composer.json
"require": { "xj/yii2-jquery-eraser": "~1.0" },
View
Assets
xj\eraser\EraserAsset::register($this);
Css
.eraser-container { position: relative; display: inline-block; width: 300px; height: 200px; } #sourceImage { position: absolute; top: 0px; left: 0px; z-index: 1; -webkit-box-shadow: 0px 0px 20px 0px #707070; -moz-box-shadow: 0px 0px 20px 0px #707070; box-shadow: 0px 0px 20px 0px #707070; } #coverImage { position: absolute; top: 0px; left: 0px; z-index: 2; }
Html
<span class="eraser-container"> <img id="sourceImage" src="/images/eraser/source-image.jpg"/> <img id="coverImage" src="/images/eraser/cover-image.jpg"/> </span>
Js
$('#coverImage').eraser({ completeRatio: 0.4, completeFunction: function(){ var progress = $('#coverImage').eraser('progress'); if (progress.toString() !== '1') { $('#coverImage').eraser('clear'); } } });