-
Notifications
You must be signed in to change notification settings - Fork 0
/
old.html
75 lines (68 loc) · 1.58 KB
/
old.html
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
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
#ball, #bball{
cursor: pointer;
}
#svg{
border: 1px solid #ccc;
width: 100%;
height: 1200px;
}
#svg text{
cursor: pointer;
}
</style>
</head>
<body>
<svg id="svg"></svg>
<script src="/js/snap.svg-min.js"></script>
<script type="text/javascript">
window.onload = function() {
var s = Snap("#svg");
var g = s.group();
var clink = s.text(600, 50, "Клонировать");
Snap.load("svg/ball.svg", function(f) {
g.append(f);
ball = g.select("circle");
ver = g.select("path");
ball.click( function() {
//console.log(this.attr('fill'));
if(this.attr('fill') == 'rgb(0, 0, 0)'){
this.attr('fill', 'green');
ver.attr('stroke', 'green');
}else{
this.attr('fill', 'black');
ver.attr('stroke', 'black')
}
} );
clink.click(function(){
var ball1 = g.clone();
var shar = ball1.select("circle");
var nitka = ball1.select("path");
var newcolor = 'rgb('+getRandomInt(0,255)+','+getRandomInt(0,255)+','+getRandomInt(0,255)+')';
shar.attr('fill', newcolor);
nitka.attr('stroke', newcolor);
ball1.drag();
});
g.drag();
});
function getRandomInt(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}
function toggleColor(c1, c2){
if(flag == true){
ball.fill(c1);
flag = false;
}else{
ball.fill(c2);
flag = true;
}
}
}
</script>
</body>
</html>