Help With EasySlider Plugin needed (how to hide something if javascript is disabled)

[Danny9]

Hi,
I’ve got Easyslider
http://cssglobe.com/post/4004/easy-slider-15-the-easiest-jquery-plugin-for-sliding
working in my website and it’s great but if javascript is disabled the images stack on top of each other and messes up the layout.

Let’s say I’ve put the slider html in a div called “container” I need that div to either display:none or display an alternative bit of html (such as just showing a static picture instead of the slideshow) if javascript is disabled.

I am a bit lost as to how to achieve this kind of thing – not sure if I need to alter the Easyslider.js file, the easyslider script in my html or the css or all 3!

So if javascript enabled show slideshow html but if disabled show static pic html is what I’m after, I guess.

[Danny9]

Keep it simple:

How to show div called “container” only if javascript is enabled ?

[Danny9]

I’ve just solved my particular problem by setting the container to overflow: hidden and that simple fix took care of the images spilling out.

I’d still be interested in seeing any examples of how to only show X if javascript enabled.

[Chris Coyier]

Showing an element only with JS enabled is pretty simple. With CSS, ensure that object is display: none; Then with JS, set the CSS for that element back to display: block; (assuming it’s block level, otherwise inline or whatever else).

[Author]

Posts