I've been using the draggable demo .js on the site to try get a div on
a web site I'm working on to be draggable. So far I'm not having any
luck and I don't really know why.
Here's the html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd";>
<html xmlns="http://www.w3.org/1999/xhtml";>
<head>
<title>Test</title>
<link rel='stylesheet' type='text/css'
href='style.css' />
<script type='text/javascript'src='MochiKit.js'></script>
<script type='text/javascript'src='draggable.js'></script>
</head>
<body>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc eget
nunc. In hac habitasse platea dictumst. Vivamus quis quam. In ut
ligula in lectus mattis volutpat. Sed tempus consectetuer dui. Integer
ipsum. Aenean quis risus eu nunc feugiat malesuada. Praesent posuere
volutpat mi. Curabitur ligula neque, faucibus ut, mattis non, egestas
ut, quam. Sed arcu. Lorem ipsum dolor sit amet, consectetuer
adipiscing elit. Etiam volutpat, ante ut gravida tristique, sem velit
tempor augue, ut tempor massa velit eget nisl. Donec vitae nisl. In
vel turpis. Nulla tempor.</p>
<p>Ut vulputate, ligula quis dictum fringilla, massa risus ullamcorper
libero, at viverra justo libero vel massa. Mauris fringilla justo quis
erat. Suspendisse auctor. Suspendisse odio erat, venenatis vitae,
rutrum a, convallis at, pede. Cras tristique hendrerit leo. In
porttitor egestas nunc. Integer varius vulputate nisi. Duis diam
purus, iaculis ut, mollis egestas, aliquet at, odio. Mauris neque
libero, gravida sed, auctor a, faucibus nec, neque. Suspendisse
ultricies. Suspendisse potenti. Praesent malesuada aliquam pede. Nam
venenatis scelerisque lorem. Aliquam erat volutpat. Quisque faucibus
erat vel mauris. Aliquam erat volutpat. Morbi tincidunt aliquam ante.
Mauris semper, ante vel ullamcorper fermentum, eros mauris fringilla
magna, ut interdum enim enim dapibus turpis.</p>
<div id="Wcont" class="draggable"><div id="whead">This</br> through
Flickr </div><div id="wgallery"><div class="cell" align="center"><a
href="http://www.flickr.com/photos/[EMAIL PROTECTED]/258563293"><img
src="http://static.flickr.com/112/258563293_a672fff083_m.jpg"/></a></
div><div class="cell" align="center"><a href="http://www.flickr.com/
photos/[EMAIL PROTECTED]/215824196"><img src="http://static.flickr.com/
79/215824196_3dfca1ebf3_m.jpg"/></a></div></div><div id="wfoot"></
div></div>
<p>Nullam scelerisque, turpis eu interdum molestie, nulla velit auctor
ligula, vitae nonummy justo nibh at quam. Quisque ultrices faucibus
est. Nulla facilisi. Pellentesque scelerisque turpis ut tortor. Fusce
adipiscing mollis tortor. Praesent fermentum libero commodo mauris.
Maecenas suscipit nonummy dolor. Suspendisse eget lorem. Duis tempus,
ante in pulvinar dapibus, nibh mauris placerat tellus, eu euismod
dolor mi sit amet enim. Aenean iaculis suscipit dolor. Ut varius, urna
at imperdiet dapibus, nibh ligula sagittis turpis, vitae aliquam pede
purus id ante. Donec nec enim. Vestibulum tempus tortor nec dui
feugiat faucibus.</p>
<p>Nulla facilisi. Aliquam leo ante, dictum adipiscing, vestibulum
quis, aliquet eu, neque. Phasellus cursus, dolor id sagittis
ultricies, metus metus varius arcu, ac auctor quam nunc et diam. Nulla
mollis, sem ac adipiscing consequat, nisl turpis adipiscing leo, non
venenatis mi justo ac lorem. Fusce justo mi, mattis eget, vestibulum
non, porttitor sagittis, ligula. Integer scelerisque interdum nibh.
Nunc dignissim enim quis ipsum. Phasellus lorem lectus, porta eu,
congue at, vulputate vitae, magna. Phasellus eu odio. Integer diam
metus, blandit eget, pellentesque sed, hendrerit nec, enim.
Pellentesque mauris est, rutrum non, placerat id, ultrices at, justo.
Donec cursus, tellus eu posuere dictum, tellus lacus feugiat est, ac
auctor nunc dui eu erat. Curabitur nec massa ac lorem pulvinar
ultricies.
</p>
<p>Pellentesque vel massa sit amet est varius ullamcorper. Quisque
laoreet tempus elit. Donec pellentesque pede. Phasellus luctus. Sed
blandit sagittis neque. Aliquam scelerisque. Vestibulum ante ipsum
primis in faucibus orci luctus et ultrices posuere cubilia Curae;
Proin fermentum purus quis enim. Duis adipiscing arcu id nisl. Nam
tortor mi, elementum sed, cursus in, auctor sit amet, mi. Aliquam
porta, eros quis blandit suscipit, metus leo condimentum nulla, et
tristique augue nulla ut massa. Praesent ultrices rhoncus nibh. In
dolor purus, sodales non, tincidunt vitae, dapibus quis, felis.
Praesent blandit, lorem nec dictum imperdiet, est nisl fringilla dui,
nec pulvinar elit augue a velit.</p>
</body>
</html>
Here's the CSS:
#Wcont{float:right;
margin-left: 5px;
}
#whead{
background-color:#2B4B86;
width:170px;
max-width:170px;
height:40px;
text-align:center;
color:white;
padding-top: 5px;
padding-bottom: 5px;
}
#wfoot{
width:170px;
height:1px;
background-color: #2B4B86;
}
#wgallery {width:170px;
height: 200px;
background-color:#E2E9F3;
padding-bottom:5px;
padding-top:10px;
background-image: url(/images/wbox.jpg);
}
img { height:100px;
border-style:none;
}
.cell {margin-top: 5px;
margin-left:2%;
margin-right:2%;
height: 90px;
overflow:hidden;
}
.draggable {
cursor: move;
}
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"MochiKit" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/mochikit?hl=en
-~----------~----~----~----~------~----~------~--~---
![http://static.flickr.com/112/258563293_a672fff083_m.jpg"/](http://static.flickr.com/112/258563293_a672fff083_m.jpg"/){kind=link}