Show More
@@ -1,71 +1,71 b'' | |||||
1 | function addImgPreview() { |
|
1 | function addImgPreview() { | |
2 | var margin = 20; |
|
2 | var margin = 20; //..change | |
3 |
|
3 | |||
4 | //keybind |
|
4 | //keybind | |
5 | $(document).on('keyup.removepic', function(e) { |
|
5 | $(document).on('keyup.removepic', function(e) { | |
6 | if(e.which === 27) { |
|
6 | if(e.which === 27) { | |
7 | $('.img-full').remove(); |
|
7 | $('.img-full').remove(); | |
8 | } |
|
8 | } | |
9 | }); |
|
9 | }); | |
10 |
|
10 | |||
11 | $('body').on('click', '.thumb', function() { |
|
11 | $('body').on('click', '.thumb', function() { | |
12 | var el = $(this); |
|
12 | var el = $(this); | |
13 | var thumb_id = 'full' + el.find('img').attr('alt'); |
|
13 | var thumb_id = 'full' + el.find('img').attr('alt'); | |
14 |
|
14 | |||
15 | if(!$('#'+thumb_id).length) { |
|
15 | if(!$('#'+thumb_id).length) { | |
16 | var img_w = el.find('img').attr('data-width'); |
|
16 | var img_w = el.find('img').attr('data-width'); | |
17 | var img_h = el.find('img').attr('data-height'); |
|
17 | var img_h = el.find('img').attr('data-height'); | |
18 |
|
18 | |||
19 | var win_w = $(window).width(); |
|
19 | var win_w = $(window).width(); | |
20 | var win_h = $(window).height(); |
|
20 | var win_h = $(window).height(); | |
21 | //new image size |
|
21 | //new image size | |
22 | if (img_w > win_w) { |
|
22 | if (img_w > win_w) { | |
23 | img_h = img_h * (win_w/img_w) - margin; |
|
23 | img_h = img_h * (win_w/img_w) - margin; | |
24 | img_w = win_w - margin; |
|
24 | img_w = win_w - margin; | |
25 | } |
|
25 | } | |
26 | if (img_h > win_h) { |
|
26 | if (img_h > win_h) { | |
27 | img_w = img_w * (win_h/img_h) - margin; |
|
27 | img_w = img_w * (win_h/img_h) - margin; | |
28 | img_h = win_h - margin; |
|
28 | img_h = win_h - margin; | |
29 | } |
|
29 | } | |
30 |
|
30 | |||
31 | var img_pv = new Image(); |
|
31 | var img_pv = new Image(); | |
32 | $(img_pv) |
|
32 | $(img_pv) | |
33 | .addClass('img-full') |
|
33 | .addClass('img-full') | |
34 | .attr('id', thumb_id) |
|
34 | .attr('id', thumb_id) | |
35 | .attr('src', $(el).attr('href')) |
|
35 | .attr('src', $(el).attr('href')) | |
36 | .appendTo($(el)) |
|
36 | .appendTo($(el)) | |
37 | .css({ |
|
37 | .css({ | |
38 | 'width': img_w, |
|
38 | 'width': img_w, | |
39 | 'height': img_h, |
|
39 | 'height': img_h, | |
40 | 'left': (win_w - img_w) / 2, |
|
40 | 'left': (win_w - img_w) / 2, | |
41 | 'top': ((win_h - img_h) / 2) |
|
41 | 'top': ((win_h - img_h) / 2) | |
42 | }) |
|
42 | }) | |
43 | //scaling preview |
|
43 | //scaling preview | |
44 | .mousewheel(function(event, delta) { |
|
44 | .mousewheel(function(event, delta) { | |
45 | var cx = event.originalEvent.clientX, |
|
45 | var cx = event.originalEvent.clientX, | |
46 | cy = event.originalEvent.clientY, |
|
46 | cy = event.originalEvent.clientY, | |
47 | i_w = parseFloat($(img_pv).width()), |
|
47 | i_w = parseFloat($(img_pv).width()), | |
48 | i_h = parseFloat($(img_pv).height()), |
|
48 | i_h = parseFloat($(img_pv).height()), | |
49 | newIW = i_w * (delta > 0 ? 1.25 : 0.8), |
|
49 | newIW = i_w * (delta > 0 ? 1.25 : 0.8), | |
50 | newIH = i_h * (delta > 0 ? 1.25 : 0.8); |
|
50 | newIH = i_h * (delta > 0 ? 1.25 : 0.8); | |
51 |
|
51 | |||
52 | $(img_pv).width(newIW); |
|
52 | $(img_pv).width(newIW); | |
53 | $(img_pv).height(newIH); |
|
53 | $(img_pv).height(newIH); | |
54 | //set position |
|
54 | //set position | |
55 | $(img_pv) |
|
55 | $(img_pv) | |
56 | .css({ |
|
56 | .css({ | |
57 | left: parseInt(cx - (newIW/i_w) * (cx - parseInt($(img_pv).position().left, 10)), 10), |
|
57 | left: parseInt(cx - (newIW/i_w) * (cx - parseInt($(img_pv).position().left, 10)), 10), | |
58 | top: parseInt(cy - (newIH/i_h) * (cy - parseInt($(img_pv).position().top, 10)), 10) |
|
58 | top: parseInt(cy - (newIH/i_h) * (cy - parseInt($(img_pv).position().top, 10)), 10) | |
59 | }); |
|
59 | }); | |
60 |
|
60 | |||
61 | return false; |
|
61 | return false; | |
62 | } |
|
62 | } | |
63 | ).draggable() |
|
63 | ).draggable() | |
64 | } |
|
64 | } | |
65 | else { |
|
65 | else { | |
66 | $('#'+thumb_id).remove(); |
|
66 | $('#'+thumb_id).remove(); | |
67 | } |
|
67 | } | |
68 | //prevent default |
|
68 | //prevent default | |
69 | return false; |
|
69 | return false; | |
70 | }); |
|
70 | }); | |
71 | } No newline at end of file |
|
71 | } |
General Comments 0
You need to be logged in to leave comments.
Login now