Prototyping 23 April 2013: Difference between revisions
(Created page with "<source lang="html4strict"> <!DOCTYPE html> <html> <head> <title></title> <script src="/lib/jquery/jquery.js"></script> <script src="/lib/jquery/jquery-ui.js"></script> <scrip...") |
Roelroscama (talk | contribs) No edit summary |
||
Line 1: | Line 1: | ||
<source lang="html4strict"> | <source lang="html4strict"> | ||
<!DOCTYPE html> | <!DOCTYPE html> | ||
<meta></meta> | |||
<html> | <html> | ||
<head> | <head> | ||
<title></title> | <title></title> | ||
<script src="/lib/jquery/jquery.js"></script> | <script src="http://pzwart3.wdka.hro.nl/lib/jquery/jquery.js"></script> | ||
<script src="/lib/jquery/jquery-ui.js"></script> | <script src="http://pzwart3.wdka.hro.nl/lib/jquery/jquery-ui.js"></script> | ||
<script> | <script> | ||
$(document).ready( function() { | |||
$('#drag').draggable(); | |||
$('#sortthis').sortable() | |||
$('li').click(function(){ | |||
$(this).css( | |||
'border', '2px dotted blue') | |||
} | |||
) | |||
}); | |||
</script> | </script> | ||
<style> | <style> | ||
li { | |||
cursor: pointer; | |||
float: left; | |||
margin: 10px; | |||
border: 1px solid; | |||
} | |||
ul { | |||
list-style: none; | |||
padding: 0; | |||
} | |||
</style> | </style> | ||
</head> | </head> | ||
<body> | <body> | ||
<div id='drag'> ======================================================== </div> | |||
<ul id ="sortthis"> | |||
<li>1</li> | |||
<li>2</li> | |||
<li>3</li> | |||
<li>4</li> | |||
</ul> | |||
</body> | </body> | ||
</html> | </html> | ||
</source> | </source> |
Revision as of 10:48, 23 April 2013
<!DOCTYPE html>
<meta></meta>
<html>
<head>
<title></title>
<script src="http://pzwart3.wdka.hro.nl/lib/jquery/jquery.js"></script>
<script src="http://pzwart3.wdka.hro.nl/lib/jquery/jquery-ui.js"></script>
<script>
$(document).ready( function() {
$('#drag').draggable();
$('#sortthis').sortable()
$('li').click(function(){
$(this).css(
'border', '2px dotted blue')
}
)
});
</script>
<style>
li {
cursor: pointer;
float: left;
margin: 10px;
border: 1px solid;
}
ul {
list-style: none;
padding: 0;
}
</style>
</head>
<body>
<div id='drag'> ======================================================== </div>
<ul id ="sortthis">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
</body>
</html>