Hello I am using scriptaculous-js-1.6.2
I have been playing around with scriptaculous, and I like what I see.
Unfortunately my first attempt at reproducing the Sortable Lists Demo
has failed. I am using the YUI Grids for a layout (playing around with
a lot of stuff...) which I am 99.9% sure isn''t effecting anything as I
have tested it out side the grid.
Any pointers would be appreciated.
Demo Link:
http://wiki.script.aculo.us/scriptaculous/page/print/SortableListsDemo
Reproduction Link:
http://ready.3cdgamers.com/projectxcssdrag/
Below is the page code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<!-- layouts require "Standards Mode" rendering, which the
401-strict
doctype triggers -->
<html>
<head>
<title>Project X Drag and Drop</title>
<link rel="stylesheet" type="text/css"
href="css/reset.css">
<link rel="stylesheet" type="text/css"
href="css/fonts.css">
<link rel="stylesheet" type="text/css"
href="css/grids.css">
<script src="js/scriptaculous.js"
type="text/javascript"></script>
</head>
<body id="yahoo-com">
<div id="doc" class="yui-t2"><!-- possible values:
t1, t2, t3, t4, t5,
t6, t7 -->
<div id="hd">
<!-- start: your content here -->
<p>MASTHEAD: Lorem ipsum dolor sit amet, consectetuer adipiscing
elit. Maecenas sit amet metus. Nunc quam elit, posuere nec, auctor in,
rhoncus quis, dui. Aliquam erat volutpat. Ut dignissim, massa sit amet
dignissim cursus, quam lacus feugiat.</p>
<!-- end: your content here -->
</div>
<div id="bd">
<!-- start: primary column from outer template -->
<div id="yui-main">
<div class="yui-b">
<!-- start: stack grids here -->
<div class="yui-gb">
<div class="yui-u first">
<!-- start: your content here -->
<div class="mod">
<div class="hd">
<ul class="sortabledemo" id="leftcolumn">
<li class="green" id="leftcolumn1">Item 1 from left
Column.</li>
<li class="green" id="leftcolumn2">Item 2 from left
Column.</li>
<li class="green" id="leftcolumn3">Item 3 from left
Column.</li>
</ul>
</div>
</div>
<!-- end: your content here -->
</div>
<div class="yui-u">
<!-- start: your content here -->
<div class="mod">
<div class="hd">
<ul class="sortabledemo" id="centercolumn">
<li class="orange" id="centercolumn1">
<span class="handle">DRAG HERE</span> Item 1 from
center column.
</li>
<li class="orange" id="centercolumn2">
<span class="handle">DRAG HERE</span> Item 2 from
center column.
</li>
<li class="orange" id="centercolumn3">
<span class="handle">DRAG HERE</span> Item 3 from
center column.
</li>
</ul>
</div>
</div>
<!-- end: your content here -->
</div>
<div class="yui-u">
<!-- start: your content here -->
<div class="mod">
<div class="hd">
<ul class="sortabledemo" id="rightcolumn">
<li class="orange" id="rightcolumn1">
<span class="handle">DRAG HERE</span> Item 1 from
right column.
</li>
<li class="orange" id="rightcolumn2">
<span class="handle">DRAG HERE</span> Item 2 from
right column.
</li>
<li class="orange" id="rightcolumn3">
<span class="handle">DRAG HERE</span> Item 3 from
right column.
</li>
</ul>
</div>
</div>
<!-- end: your content here -->
</div>
</div>
<script type="text/javascript">
// <![CDATA[
Sortable.create("leftcolumn",
{dropOnEmpty:true,containment:["leftcolumn","centercolumn","rightcolumn"],constraint:false});
Sortable.create("centercolumn",
{dropOnEmpty:true,handle:''handle'',containment:["leftcolumn","centercolumn","rightcolumn"],constraint:false});
Sortable.create("righcolumn",
{dropOnEmpty:true,handle:''handle'',containment:["leftcolumn","centercolumn","rightcolumn"],constraint:false});
// ]]>
</script>
<!-- end: stack grids here -->
</div>
</div>
<!-- end: primary column from outer template -->
</div>
<div id="ft">
<!-- start: your content here -->
<p>FOOTER: Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Maecenas sit amet metus. Nunc quam elit, posuere nec, auctor in,
rhoncus quis, dui. Aliquam erat volutpat. Ut dignissim, massa sit amet
dignissim cursus, quam lacus feugiat.</p>
<!-- end: your content here -->
</div>
</div>
</body>
</html>
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs
-~----------~----~----~----~------~----~------~--~---