You are here: Home / Freebies For Websites / Demos & Snippets

Sweep-in News Scroller with Controls (no jQuery)

This demo has been replaced with a version that has CSS animation support for the stock Android browser.

A light-weight news scroller where each new message sweeps in, while the previous message sweeps away and fades out. Interactive controls are powered with plain JavaScript (no dependancies).

Works in modern browsers and IE8+ (no sweep or fade in IE8/9).

Please view the source of this page for HTML markup, CSS and JS.

Sweep Up

  • NEDDC website ranked 10th in UK

    (1/10) 28th Feb 20 - Accessibility results are in for the new NEDDC website and I'm really pleased that it's been ranked 10th out of 407 Councils in the UK, with a score of 93%

  • Image Switch On-Scroll Demo

    (2/10) 14th Feb 20 - Scroll down the page to reveal a hidden image with this nifty before and after image switch effect. Change the CSS transition or animation to customise.

  • NEDDC RWD website launched

    (3/10) 10th Jan 20 - My first major project in my new job! A responsive website for North East Derbyshire District Council, with focus on accessibility. The site will be officially assessed for accessibility soon.

  • Getting to grips with my new role

    (4/10) 14th Jun 19 - 2 months into my new job and I've been using lots of brain-power wrapping my head around the new systems. It's been very rewarding so far and I get to work with a team of fab folks :)

  • Training for Web Technician cover

    (5/10) 25th Mar 19 - 2 weeks to train my web cover before I go. I foresee many hours of document prep, code clean-up, and picking apart the "what the heck did that do" scripts from way back when. Fun!

  • HMS Garden Design RWD relaunch

    (6/10) 17th Mar 19 - I got the go-ahead to work on a responsive redesign of the HMS Garden Design website. The site now works much better on a multitude of devices.

  • Krita freebie image editor training

    (7/10) 05th Mar 19 - Spent the morning in an image editing training session with Ashgate Croft School. Krita makes a great alternative to Photoshop... and it's totally FREE!

  • Fast Cal minor warnings fixed

    (8/10) 02nd Mar 19 - I've fixed a few missing variables that were generating minor PHP warnings. Only two core files updated. No new features to report this time though.

  • Brighter, whiter look for DHFS

    (9/10) 27th Feb 19 - For the past few weeks I've been working on a cleaner website look for DHFS, which includes an always visible search bar to improve usability.

  • New role in local government

    (10/10) 06th Feb 19 - Today I interviewed for the post of Application Development Officer within local government... I got the job! It will be strange to leave Education after 11 years, but here's to the future!

Sweep Left

  • NEDDC website ranked 10th in UK

    (1/10) 28th Feb 20 - Accessibility results are in for the new NEDDC website and I'm really pleased that it's been ranked 10th out of 407 Councils in the UK, with a score of 93%

  • Image Switch On-Scroll Demo

    (2/10) 14th Feb 20 - Scroll down the page to reveal a hidden image with this nifty before and after image switch effect. Change the CSS transition or animation to customise.

  • NEDDC RWD website launched

    (3/10) 10th Jan 20 - My first major project in my new job! A responsive website for North East Derbyshire District Council, with focus on accessibility. The site will be officially assessed for accessibility soon.

  • Getting to grips with my new role

    (4/10) 14th Jun 19 - 2 months into my new job and I've been using lots of brain-power wrapping my head around the new systems. It's been very rewarding so far and I get to work with a team of fab folks :)

  • Training for Web Technician cover

    (5/10) 25th Mar 19 - 2 weeks to train my web cover before I go. I foresee many hours of document prep, code clean-up, and picking apart the "what the heck did that do" scripts from way back when. Fun!

  • HMS Garden Design RWD relaunch

    (6/10) 17th Mar 19 - I got the go-ahead to work on a responsive redesign of the HMS Garden Design website. The site now works much better on a multitude of devices.

  • Krita freebie image editor training

    (7/10) 05th Mar 19 - Spent the morning in an image editing training session with Ashgate Croft School. Krita makes a great alternative to Photoshop... and it's totally FREE!

  • Fast Cal minor warnings fixed

    (8/10) 02nd Mar 19 - I've fixed a few missing variables that were generating minor PHP warnings. Only two core files updated. No new features to report this time though.

  • Brighter, whiter look for DHFS

    (9/10) 27th Feb 19 - For the past few weeks I've been working on a cleaner website look for DHFS, which includes an always visible search bar to improve usability.

  • New role in local government

    (10/10) 06th Feb 19 - Today I interviewed for the post of Application Development Officer within local government... I got the job! It will be strange to leave Education after 11 years, but here's to the future!

Sweep Down

  • NEDDC website ranked 10th in UK

    (1/10) 28th Feb 20 - Accessibility results are in for the new NEDDC website and I'm really pleased that it's been ranked 10th out of 407 Councils in the UK, with a score of 93%

  • Image Switch On-Scroll Demo

    (2/10) 14th Feb 20 - Scroll down the page to reveal a hidden image with this nifty before and after image switch effect. Change the CSS transition or animation to customise.

  • NEDDC RWD website launched

    (3/10) 10th Jan 20 - My first major project in my new job! A responsive website for North East Derbyshire District Council, with focus on accessibility. The site will be officially assessed for accessibility soon.

  • Getting to grips with my new role

    (4/10) 14th Jun 19 - 2 months into my new job and I've been using lots of brain-power wrapping my head around the new systems. It's been very rewarding so far and I get to work with a team of fab folks :)

  • Training for Web Technician cover

    (5/10) 25th Mar 19 - 2 weeks to train my web cover before I go. I foresee many hours of document prep, code clean-up, and picking apart the "what the heck did that do" scripts from way back when. Fun!

  • HMS Garden Design RWD relaunch

    (6/10) 17th Mar 19 - I got the go-ahead to work on a responsive redesign of the HMS Garden Design website. The site now works much better on a multitude of devices.

  • Krita freebie image editor training

    (7/10) 05th Mar 19 - Spent the morning in an image editing training session with Ashgate Croft School. Krita makes a great alternative to Photoshop... and it's totally FREE!

  • Fast Cal minor warnings fixed

    (8/10) 02nd Mar 19 - I've fixed a few missing variables that were generating minor PHP warnings. Only two core files updated. No new features to report this time though.

  • Brighter, whiter look for DHFS

    (9/10) 27th Feb 19 - For the past few weeks I've been working on a cleaner website look for DHFS, which includes an always visible search bar to improve usability.

  • New role in local government

    (10/10) 06th Feb 19 - Today I interviewed for the post of Application Development Officer within local government... I got the job! It will be strange to leave Education after 11 years, but here's to the future!

Fade In

  • NEDDC website ranked 10th in UK

    (1/10) 28th Feb 20 - Accessibility results are in for the new NEDDC website and I'm really pleased that it's been ranked 10th out of 407 Councils in the UK, with a score of 93%

  • Image Switch On-Scroll Demo

    (2/10) 14th Feb 20 - Scroll down the page to reveal a hidden image with this nifty before and after image switch effect. Change the CSS transition or animation to customise.

  • NEDDC RWD website launched

    (3/10) 10th Jan 20 - My first major project in my new job! A responsive website for North East Derbyshire District Council, with focus on accessibility. The site will be officially assessed for accessibility soon.

  • Getting to grips with my new role

    (4/10) 14th Jun 19 - 2 months into my new job and I've been using lots of brain-power wrapping my head around the new systems. It's been very rewarding so far and I get to work with a team of fab folks :)

  • Training for Web Technician cover

    (5/10) 25th Mar 19 - 2 weeks to train my web cover before I go. I foresee many hours of document prep, code clean-up, and picking apart the "what the heck did that do" scripts from way back when. Fun!

  • HMS Garden Design RWD relaunch

    (6/10) 17th Mar 19 - I got the go-ahead to work on a responsive redesign of the HMS Garden Design website. The site now works much better on a multitude of devices.

  • Krita freebie image editor training

    (7/10) 05th Mar 19 - Spent the morning in an image editing training session with Ashgate Croft School. Krita makes a great alternative to Photoshop... and it's totally FREE!

  • Fast Cal minor warnings fixed

    (8/10) 02nd Mar 19 - I've fixed a few missing variables that were generating minor PHP warnings. Only two core files updated. No new features to report this time though.

  • Brighter, whiter look for DHFS

    (9/10) 27th Feb 19 - For the past few weeks I've been working on a cleaner website look for DHFS, which includes an always visible search bar to improve usability.

  • New role in local government

    (10/10) 06th Feb 19 - Today I interviewed for the post of Application Development Officer within local government... I got the job! It will be strange to leave Education after 11 years, but here's to the future!

Related

More demos and snippets

Did you find this useful? There are more demos and code snippets this way.