D
David Karr
I could use some help diagnosing why something in my app or either of
the two frameworks I'm using is mysteriously setting the "left" style
of a "ul" on my page to 474px (you will very likely see a different,
but similar value). I see the exact same behavior on Firefox and IE
(although I only rarely test on IE at this point).
For reference, the URL for my test app is at <http://
www.rattieworldocomfort.com/carouseltest/mdkcarouseltest2.html>.
The app uses both YUI-2.5.2 and the YUI Carousel 0.6.3. What you'll
see at the URL I've posted is a carousel displaying some thumbnail
images. Below that carousel will be an "empty" carousel (it actually
has one "fake" item to convince the carousel to have a reasonable non-
collapsed size).
The test case is to drag the first image (any of them will do) from
the top carousel onto the bottom carousel. The copied (not moved)
image should display itself in the first position of the second
carousel. You'll also see the fullsize version of the thumbnail appear
below both carousels, but that's unrelated to my problem.
Instead of appearing in the first position, however, it instead
appears in the last position (fourth). I imagine this is some
unexpected behavior of the Carousel component, but I'm at a loss to
understand why it's doing it, and even worse, how.
Under the covers, what I saw was that before the drop, the following
element in my HTML looked like this:
<ul class="carousel-list carousel-horizontal" style="position:
relative; left: 0px;">
<li id="favorites-item-1"><div class="fakeimage"/></li></
ul>
After the drop, it's like this:
<ul class="carousel-list carousel-horizontal" style="position:
relative; left: 474px;"><li id="favorites-item-1"><img
onmouseover="displayFullSize('photos/IMG_4129web.jpg');" alt="This is
a long, long title, going on and on to no particular point"
src="photos/tn_IMG_4129web.jpg" class="imageEntry"/>This is a long,
long title, going on and on to no particular point</li></ul>
The key here is the change from "left:0px" to "left:474px". I've
looked at all the code in YUI and Carousel, and I found the only two
places that obviously set the "left" style of ANYTHING, but neither of
these are the culprits, as I set breakpoints there, and also modified
local copies to add log statements indicating what value it was
setting. Neither of them ever set that value.
If I could figure out how it's setting that value, I might be able to
understand why it's doing that, and come to some sort of resolution
(it's at this point that I wondered whether Firebug will ever have the
ability to "break on particular element changes", and apparently
they're already envisioning this feature).
Notice that if you continue dragging other images from the top to the
bottom, it seems as if they go nowhere, but if after you drop the
other three visible images you then click the right-arrow image,
you'll see them scroll into view.
Any reasonable advice you can provide would be useful.
Thanks.
the two frameworks I'm using is mysteriously setting the "left" style
of a "ul" on my page to 474px (you will very likely see a different,
but similar value). I see the exact same behavior on Firefox and IE
(although I only rarely test on IE at this point).
For reference, the URL for my test app is at <http://
www.rattieworldocomfort.com/carouseltest/mdkcarouseltest2.html>.
The app uses both YUI-2.5.2 and the YUI Carousel 0.6.3. What you'll
see at the URL I've posted is a carousel displaying some thumbnail
images. Below that carousel will be an "empty" carousel (it actually
has one "fake" item to convince the carousel to have a reasonable non-
collapsed size).
The test case is to drag the first image (any of them will do) from
the top carousel onto the bottom carousel. The copied (not moved)
image should display itself in the first position of the second
carousel. You'll also see the fullsize version of the thumbnail appear
below both carousels, but that's unrelated to my problem.
Instead of appearing in the first position, however, it instead
appears in the last position (fourth). I imagine this is some
unexpected behavior of the Carousel component, but I'm at a loss to
understand why it's doing it, and even worse, how.
Under the covers, what I saw was that before the drop, the following
element in my HTML looked like this:
<ul class="carousel-list carousel-horizontal" style="position:
relative; left: 0px;">
<li id="favorites-item-1"><div class="fakeimage"/></li></
ul>
After the drop, it's like this:
<ul class="carousel-list carousel-horizontal" style="position:
relative; left: 474px;"><li id="favorites-item-1"><img
onmouseover="displayFullSize('photos/IMG_4129web.jpg');" alt="This is
a long, long title, going on and on to no particular point"
src="photos/tn_IMG_4129web.jpg" class="imageEntry"/>This is a long,
long title, going on and on to no particular point</li></ul>
The key here is the change from "left:0px" to "left:474px". I've
looked at all the code in YUI and Carousel, and I found the only two
places that obviously set the "left" style of ANYTHING, but neither of
these are the culprits, as I set breakpoints there, and also modified
local copies to add log statements indicating what value it was
setting. Neither of them ever set that value.
If I could figure out how it's setting that value, I might be able to
understand why it's doing that, and come to some sort of resolution
(it's at this point that I wondered whether Firebug will ever have the
ability to "break on particular element changes", and apparently
they're already envisioning this feature).
Notice that if you continue dragging other images from the top to the
bottom, it seems as if they go nowhere, but if after you drop the
other three visible images you then click the right-arrow image,
you'll see them scroll into view.
Any reasonable advice you can provide would be useful.
Thanks.