This report concerns a display bug of scriptaculous in ie 7.
The following code functions as expected in Firefox 2.0 and Opera 9.0
Here are some <img>s in a div element :
<div id="samplebox">
<img src="img/sample/1.gif" class="samplebase" id="base_sample_1">
<img src="img/sample/2.gif" class="samplebase" id="base_sample_2">
...
<div class="spacer"></div>
</div>
CSS code :
.samplebase {
display: inline;
vertical-align: middle;
}
div#samplebox{
''' position:relative '''
width: 300px;
height: 200px;
overflow: auto;
}
And the dragging function :
var sampleList = document.getElementsByClassName(sampleClass);
for (var i = 0; i < sampleList.length; i++) {
var drag = new Draggable(sampleList[i], {
revert: true
,ghosting: true
}
}
When displayed in IE7, there is a bug with the <img>s : instead of appearing in the bounding DIV, they are out of the box, and the scrollbar does'nt work, even when though it appears.
To fix it, I had to add the property position : relative to the box. Since I did this, another bug appeared : when beginning to drag, the <img> element is shifted toward the top, away from the cursor. The distance between them is equal to the value of the property $('samplebox').scrollTop .
Please note that the flag includeScrollOffsets in prototype.js is activated.
Ruby on Rails |
Screencasts |
Download |
Documentation |
Weblog |
Community |
Source
