Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

fallback for jquery isotope if javascript is disabled?

Is there a fallback for jQuery isotope if JavaScript is disabled?

Suppose if I m using there fitColumns property, is there a fallback to that layout style if JavaScript is disabled, like what u have in d new myspace.
the initial posts, which appears on your myspace home page, will be styled properly but no additional post will load when you further scroll.
What kind of CSS structure or fallback methodology can be used for such situations?

like image 597
arjun Avatar asked Nov 03 '22 03:11

arjun


1 Answers

If JavaScript is disabled and if you want to keep the elements positioned nicely like as if the jQuery Isotope is doing its job then you can only rely on CSS. That would mean you would have to manually position those elements in the order that you want.

If you're OK with that then follow these steps below to start:

  1. Put a class name on the main wrapper of your Isotope elements such as off. For example: <div id="isotope-container" class="isotope off">
  2. Start positioning your elements manually and include .off as one of the selectors. For example: .isotope.off .isotope-element-1 { position:absolute; top: 10px; left: 10px; } .isotope.off .isotope-element-2 { position:absolute; top: 10px; left: 100px; }
  3. Then on your general jquery file where you have all other stuff written on, check if .off class exists and if it does, remove it. For example: if($('#isotope-container.isotope').hasClass('off')){ $('#isotope-container.isotope').removeClass('off'); }
like image 156
kyooriouskoala Avatar answered Nov 09 '22 08:11

kyooriouskoala