View RSS Feed

Recent Blogs Posts

  1. Add 'Swipe Support' to your website (RWD CSS3 Any Content Slider demo)

    Let visitors 'feel' their way around the interactive areas of your website by adding support for native swipe gestures on touch devices. I'll be using my earlier RWD CSS3 Any Content Slider (JS auto-play) as a demo, but you can easily take away from this post to add touch gestures to your own apps... Need some other ideas?

    Website features that may benefit from a left or right swipe;
    - a content slider (progress back and forth between slides)
    - an image gallery (progress ...
  2. RWD Cross-Fade Slideshow with Retina Images

    Want a simple, responsive cross-fading slideshow, with images that are lightweight AND retina-ready? You got it!

    Demo: http://fofwebdesign.co.uk/template/_...ideshow-js.htm

    Works in modern browsers and IE9+ (no fade effect in IE9). IE8 users just see a static image - but you can make IE8 act like IE9 with some CSS mods (see comments)


    This post covers 2 topics that can be used separately OR combined. First up... the slideshow. ...
  3. RWD CSS3 Any Content Slider (JS auto-play)

    Today I revisit the Responsive CSS3 Any Content Slider, enhancing it with auto-play and start/stop controls (and later, a large touch-toggle with swish 'zoom' animation), thanks to a sprinkle of JavaScript.

    But first, a recap on the CSS-only version that was covered in an earlier blog post, mainly just as a reminder about usage of the checkbox hack to emulate click events via CSS - that's what gives it functionality without JavaScript, but, I was contacted and asked to make it play ...
  4. Responsive CSS3 Any Content Slider (no JavaScript)

    Fiddling some more with CSS transitions and the checkbox hack to emulate click events via CSS, I tried my hand at making a CSS-only content slider.

    Initially I attempted to make it with checkboxes, but due to the behaviour of multiple checkboxes being checkable at the same time (which totally mungs up the idea for a slider where you only want one slide activated), I turned to radio buttons instead.

    The key difference between radios and checkboxes is that only one radio ...

    Updated 11-27-2014 at 12:27 PM by Beverleyh (basic support added for IE7)

    Categories
    CSS related
  5. Extra Buttons for Ultimate Fade-in slideshow

    SPECIAL NOTE:

    Few of the links previously herein still went where they did (if anywhere) when this was first written. All necessary missing files and more can be downloaded in the current distribution archive:

    extrabuttonsdistro.zip

    Most recent additions - graceful integration with Ultimate Fade In Slideshow (2.6.1)'s new swipe feature, bug fixes to the original fadeslideshow.js script as noted in the included fadeslideshow.js file's comments section. Also included ...

    Updated 03-08-2016 at 03:47 AM by jscheuer1 (include updated files and explanations of same)

    Categories
    DD Scripts Mods , Post a JavaScript , JavaScript & Ajax