Posted by kwinters on April 22, 2010 at 3:34pm
1 follower
Jump to:
| Project: | jQuery UI Carousel |
| Version: | 6.x-1.1 |
| Component: | Code |
| Category: | bug report |
| Priority: | normal |
| Assigned: | Unassigned |
| Status: | active |
Issue Summary
When javascript is disabled, this module tends to really mangle a page.
In ui.carousel.css, selector .ui-carousel-clip has a position: relative and z-index, so when all the LIs don't get moved to the right place via jQuery a lot of content gets obscured.
Some suggestions for improvement:
* Hide the arrows in HTML / CSS, make visible with jQuery
* Make every LI but the first one display:none, make visible with jQuery
Comments
#1
Here's what I ultimately ended up doing:
/* for javascript disabled */
div.carousel-navigation a {
display: none;
}
div.carousel-navigation a.ui-icon {
display: block;
}
div.ui-carousel-clip li.not-first {
display: none;
}
div.ui-carousel-clip li.not-first.ui-carousel-item {
display: block;
}
and in the template:
$firstItem = current($items);
foreach ($items as $item) {
?>
<?php">if ($firstItem === $item) print 'first'; else print 'not-first';
?>
I still definitely think this should be a default for the module.