Hi,
I attach some code here. It''s an example in which I show too much
blinking (caused by too many draggable possition switching) when trying
to move any draggable.
I supposed it should be reported as a bug, but I wanted to ask here
first because I don''t have that many expertise in scriptaculous and
javascript. I suggest anyone to copy this HTML code into an .html file
and test it (I tested it in Firefox, but blinking happens as well in
IE).
¿Did I do anything wrong? ¿Any alternative way to get the expected
results?
Thanks.
Germán.
---
Here''s the code:
<html>
<head>
<title></title>
<script src="js/scriptaculous/prototype.js"
type="text/javascript"></script>
<script src="js/scriptaculous/scriptaculous.js"
type="text/javascript"></script>
<style>
#content #squares,
#content #squares_noDropOnEmpty
{
border: 1px solid #AAAAAA;
float: left;
width: 300px;
padding: 5px;
}
#content #squares_nofloat
{
border: 1px solid #AAAAAA;
width: 300px;
padding: 5px;
}
#content #squares div.square,
#content #squares_noDropOnEmpty div.square,
#content #squares_nofloat div.square
{
width: 100px;
height: 100px;
color: #666666;
cursor: move;
float: left;
background-color: #EEEEEE;
}
</style>
</head>
<body id="content">
<p>Blinks quite a lot when trying to move any square into a row
different than 1st</p>
<div id="squares">
<div class="square">Sample text</div>
<div class="square">Sample text</div>
<div class="square">Sample text</div>
<div class="square">Sample text</div>
<div class="square">Sample text</div>
<div class="square">Sample text</div>
<div class="square">Sample text</div>
<div class="square">Sample text</div>
<div class="square">Sample text</div>
</div>
<br clear="all" />
<p>If I create the Sortable object without the "dropOnEmpty:
true"
option, it works well... But I do need dropOnEmpty!</p>
<div id="squares_noDropOnEmpty">
<div class="square">Sample text</div>
<div class="square">Sample text</div>
<div class="square">Sample text</div>
<div class="square">Sample text</div>
<div class="square">Sample text</div>
<div class="square">Sample text</div>
<div class="square">Sample text</div>
<div class="square">Sample text</div>
<div class="square">Sample text</div>
</div>
<br clear="all" />
<p>Removing "float: left;" from sortable''s div style,
blinking
dissapears... But it looks awful!</p>
<div id="squares_nofloat">
<div class="square">Sample text</div>
<div class="square">Sample text</div>
<div class="square">Sample text</div>
<div class="square">Sample text</div>
<div class="square">Sample text</div>
<div class="square">Sample text</div>
<div class="square">Sample text</div>
<div class="square">Sample text</div>
<div class="square">Sample text</div>
</div>
<script type="text/javascript"
language="javascript">
// <![CDATA[
Sortable.create("squares",
{
tag: ''div'',
overlap: ''horizontal'',
constraint: false,
dropOnEmpty: true
});
Sortable.create("squares_noDropOnEmpty",
{
tag: ''div'',
overlap: ''horizontal'',
constraint: false
});
Sortable.create("squares_nofloat",
{
tag: ''div'',
overlap: ''horizontal'',
constraint: false,
dropOnEmpty: true
});
// ]]>
</script>
</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
-~----------~----~----~----~------~----~------~--~---