Ive since sorted this one and thought I would post for the group. The
search is dynamic and the # of elements (LIs) changes per inputs in
other form elements on the page. So, the first step was to count the
LIs in the UL, then multiply the result by the width of each element,
and apply that value as the css width to the containing UL. Note: I
found that applying multiple properties via the css() method was
problematic- all of the attributes had to be applied at once. Here is
the solution in a nutshell:
var resultsQuantity = $("#results ul > li").length;
$('#resultsSlider').slider({
min: 0,
max: 6238,
animate: true,
slide: function (event, ui) {
var resultsQuantity = $("ul#resultsUL > li").length; // count
results
$(this).slider('option', 'max', resultsQuantity * 226); // set
the
max value of the slider accordingly
$("ul#resultsUL").css('width', resultsQuantity * 226 + 'px').css
('left', ui.value * -1); // set the width of the UL accordingly and
set up the slide of the results on change of slider value
},
stop: function (event, ui) {
var resultsQuantity = $("ul#resultsUL > li").length; // count
results
$(this).slider('option', 'max', resultsQuantity * 226); // set
the
max value of the slider accordingly
$("ul#resultsUL").css('width', resultsQuantity * 226 +
'px').animate
({'left' : ui.value * -1}, 500); // set the width of the UL
accordingly and set up the slide of the results on change of slider
value
},
});
On Mar 26, 2:59 pm, Adam <adambu...@gmail.com> wrote:
> Im using an apple product page-style slider as described on Remy's
> awesome jqueryfordesigners.com, but with content in addition to the
> images. Im having some css/display issues.
>
> http://www.viewwestaspen.com.asp1-10.websitetestlink.com/home.html
>
> His demo makes use of the items in the list being set to
> display:inline, but this causes funky results with the H4s and P tags
> that I have under the images also inside each LI. Ive seen some
> similar executions that let the LIs be block and float left, but use
> some additional JQ to calculate how wide the UL slider should be (on
> the fly). Would that be the way to make this display correctly?
> Thanks!
> -Adam
