code.Atomic8Ball.com

  • jQuery and jQuery UI

    Current versions are:

    • <link rel="stylesheet" http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.min.css />
      (the theme is optional, see if what you're doing works without the theme first, different themes are available on jqueryui.com)
    • <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    • <script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
      (load .css files before .js files)
    • Usually using the current version is fine, however, some items (particularly older slideshows) break in the newest versions of jQuery. If that happens try loading 1.8.1 instead.

    jQuery tips:

    • DO: search the site to see of jQuery is already loaded, jQuery should only be loaded once - either on the one, single page that's utilizing jQuery, or on the master page.
    • DON'T: copy/paste loading jQuery and jQueryUI on to lots of different pages. If you have, for example, 8 pages with accordions on them then you should have a nested sub-master page that loads the widget and has the script on it.
    • DO: ask for help if you're confused or need assistance. Miles, Brian and Andrew are all good resources to ask.
    • DON'T: just copy/paste jQuery with no understanding of what it's doing, as you may end up breaking other pages on the site.
    • DO: test every page LIVE that has had jQuery added or modified on it to confirm that it is functioning as expected.
  • Add This Event

    Banner Button

    jQuery plugin that adds ability to quickly add an event to a calendar. Especially useful for seminars, webinars, tradeshows, etc.

    Instructions

    Setup: Approx. 5-10 mins

  • tiny Cycle (slideshow)

    Simple Javascript Slideshow

    A minimalist slideshow plugin that supports simple features.

    Limitations

    • No dot links.
    • Only two fade effects.
    • Speed of transition, and time between transitions are the only variables that can be controlled.
    • If you need more features, then either you know what you're doing, or the task is misassigned.
      Visit http://jquery.malsup.com/cycle2/ and implement Cycle2 instead.

    Setup: Approx. 5-15 mins.

  • jQuery Tabs

    Horizontal tab listing

    Setup:Approx. 10 mins.

  • Carousel

    JQuery Carousel

    Scrolls through images or text vertically or horizontally.

    Setup: Approx. 30-60 mins.

  • Tabbed Slideshow

    Tabbed jQuery Slideshow

    A slideshow with tabs that can be controlled by the user. Alternatively the tabs can be hidden for a slideshow capable of rendering text instead of just images.

    Setup: Approx. 30-60mins.

  • Image Gallery Lightbox

    Image Gallery Lightbox

    Open and scroll through images from a gallery with a faded shadow background.

    Setup: Approx. 30 mins.

  • jQuery Accordion

    jQuery Accordion

    Show/hide blocks of text one at a time.

    Setup: Approx. 5 mins.