hello-world/SampleFi.txt at master · navin-nnk/hello-world · GitHub

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
<html>

<head>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.8.24/jquery-ui.min.js" type="text/javascript"></script>
<link href="http://code.jquery.com/ui/1.8.24/themes/blitzer/jquery-ui.css" rel="stylesheet" type="text/css" />

<style type="text/css">
body
{
    font-family: Arial;
    font-size: 10pt;
}
img
{
    height: 100px;
    width: 100px;
    margin: 2px;
}
.draggable
{
    filter: alpha(opacity=60);
    opacity: 0.6;
}
.dropped
{
    position: static !important;
}
#dvDest
{
    border: 5px solid #ccc;
    padding: 5px;
    min-height: 100px;
    width: 430px;
	text-align: center;
	color : blue;


}
</style>

<script type="text/javascript">
$(function () {

    $("#dvDest,#chooseFile").droppable({
        drop: function (event, ui) {
            if ($("#dvDest #chooseFile img").length == 0) {
                $("#dvDest").html("");
            }
            ui.draggable.addClass("dropped");
            $("#dvDest").append(ui.draggable);
        }
    });


});


</script>


</head>
<body>

<div id="dvDest">
         <input id="chooseFile" type="file" accept="image/*" onchange="loadFile(event)">
</div>

</body>
</html>