-
Notifications
You must be signed in to change notification settings - Fork 4
/
jquery-before-after-slider.js
40 lines (33 loc) · 1.03 KB
/
jquery-before-after-slider.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
(function($) {
$.fn.hanBeforeAfterSlider = function(c) {
//console.log(c);
var point = parseInt(c.width) / 2;
$(this).css({
"width": c.width,
"height": c.height
});
var i1 = document.createElement("img");
var i2 = document.createElement("div");
$(i1).attr("src", c.firstImage);
$(i1).css({
"height": c.height,
"position": "absolute",
});
$(i2).css({
"background-image": "url(" + c.secondImage + ")",
"background-size": "cover",
"width": c.start,
"height": c.height,
"position": "absolute",
"background-repeat": "no-repeat",
"border-right": "1px solid gray"
});
var offset = $(i2).offset();
$(this).mousemove(function(event) {
offset = $(i2).offset();
$(i2).css("width", event.pageX - offset.left);
});
$(this).append(i1);
$(this).append(i2);
};
}(jQuery));