New to jQuery sliders and carousels; site gets completly garbled when java is off

Hi everyone,

As I wrote in the summary, I’ve had some success getting my site to look like I want it w/ the help of jQuery, but I’ve found that when java is turned off in the browser, things get messed up, particularly jCarousel lite.

Does anyone have any suggestions on changes I can make to keep this site functional in these circumstances?


code for the 1st carousel in index.php (best sellers):

<div id="newDemo">
<div class="carousel main">
            <a href="#" class="prev2">&nbsp</a>
<div class="new">
<a href="#" class="next2">&nbsp</a>
            <div class="clear"></div> 
<script type="text/javascript">
$(function() {
        btnNext: ".next2",
        btnPrev: ".prev2",
        visible: 4

stylesheet entries for the 1st instance of the carousel (best sellers):

/*_____________________________________________ Start - Projects - jCarouselLiteDemo _____________________________________________*/

#jCarouselLiteDemo .carousel  {
    padding: 10px 0 0 0;
    margin: 0 0 20px 10px;
    position: relative;     

#jCarouselLiteDemo .main {
        margin-left: 0px;

#jCarouselLiteDemo .carousel button { /*Don't remove this. we still use this for individual demos. only the front pages use images as of now*/
        float: left;

#jCarouselLiteDemo .carousel a.prev, #jCarouselLiteDemo .carousel {
        display: block;
        float: left;
        width: 30px;
        height: 143px;
        text-decoration: none;
        background: url("/images/home_page/imageNavLeft.gif") left 60px no-repeat;

#jCarouselLiteDemo .carousel {
        background: url("/images/home_page/imageNavRight.gif") right 60px no-repeat;

#jCarouselLiteDemo .carousel {
        background-image: url("/images/home_page/imageNavRightHover.gif");

#jCarouselLiteDemo .carousel a.prev:hover {
        background-image: url("/images/home_page/imageNavLeftHover.gif");

#jCarouselLiteDemo .carousel a:hover, #jCarouselLiteDemo .carousel a:active {
        border: none;
        outline: none;

#jCarouselLiteDemo .carousel .jCarouselLite {
        border: 0px solid black;
        float: left;
        background-color: #ffffff;
        /* Needed for rendering without flicker */
        position: relative;
        visibility: hidden;
        left: -5000px;

#jCarouselLiteDemo .carousel ul {
        margin: 0;

#jCarouselLiteDemo .carousel li img, 
#jCarouselLiteDemo .carousel li p {
        background-color: #fff;
        width: 156px;
        height: 118px;
        margin: 0px 10px 0px 10px;

#jCarouselLiteDemo .imageSlider li img, 
#jCarouselLiteDemo .imageSlider li p, 
#jCarouselLiteDemo .imageSliderExt li img , 
#jCarouselLiteDemo .imageSliderExt li p {
        width: 400px;
        height: 300px;

#jCarouselLiteDemo a img {
  border:0px solid #072B8A;
  margin: 0px 0px 0px 0px;
  vertical-align: top;
#jCarouselLiteDemo a:hover img {
  border:0px solid #95B3D7

/*_____________________________________________ End - Projects - jCarouselLiteDemo _____________________________________________*/

Hssss!!! The name of the language is JavaScript, not Java. They are both completely different and unrelated programming languages.

The demo page for jCarousel lite doesn’t look all that useful too when JavaScript is disabled either.
You may want to look for another carousel where their demo page doesn’t look as munted when javascript is disabled.

Doh! Java is not JavaScript. I should’ve known that but I’ll be sure not to forget.

Of course I also should have checked to see how jCarousel Lite deprecates (if I’m using that term correctly here) on the demo page. Thanks Paul.

I just hope regular jCarousel fares better…