Section Wipes (natural) Wiping in content with the natural scroll movement. This commonly used effect can be very easily achieved using ScrollMagic's Scene.setPin method. If you want to create a 'pause' between the slides, simply add a margin-bottom to them (see between slide 3 and 4). Section Wipes (natural) Wiping in content with the natural scroll movement. This commonly used effect can be very easily achieved using ScrollMagic's Scene.setPin method. If you want to create a 'pause' between the slides, simply add a margin-bottom to them (see between slide 3 and 4). Native JS, Cross Browser, Smooth Scroll (Update 2020) Setting ScrollTop does give the desired result but the scroll is very abrupt. Using jquery to have smooth scroll was not an option. So here's a native way to get the job done that supports all major browsers. Reference - caniuse. Magic Scroll can be completely customized by tweaking the CSS and 16 JavaScript options. To make it even easier, the Magic Scroll wizard will help you choose the perfect settings. The first section will have a content centered similar to last time. The sections 2,3 and 4 will have a ScrollMagic card on the left and the copy on the right. Before we start animating anything with ScrollMagic we’ll create the HTML and CSS for our page.

• Magic Scroll Jsm
• Magic Scroll Js

Responsive slider for images, videos, product thumbnails, featured content, any HTML

Fast. Easy to use. jQuery compatible

Integrations and plugins Use these plugins and extensions to setup Magic Scroll on your site without writing a single line of code.

One tool. Infinite possibilities.

Product thumbnails slider/carousel

Do you have plenty of product images but don't know how to fit them all in? Magic Scroll lets you display all your product images in an elegant and intuitive way. Our responsive slider will make the experience effortless for both mobile and desktop users.

Featured Content slider

Show off your best-selling products on your homepage or category pages. If you're a blog owner - use it to promote your best content. Sliders usually slow down page load time. Not Magic Scroll! Enable Lazy-loading and enjoy both a fast website and a slick 'featured' section.

Related products slider

One of the best ways to increase your sales is to cross-sell and up-sell related products. Display your related products with Magic Scroll and see that average order value increase like magic.

Cover flow slider

Love Apple's cover flow effect? Replicate this easily with Magic Scroll.

Review/Testimonial slider

An elegant way to show off multiple reviews without compromising design. It's a smart-phone driven world right now. We got that covered. Magic Scroll is fully responsive and works flawlessly on every device. More than that - it supports swipe gestures, providing your users the best experience they can wish for.

Optimized for every device

Transparent Pricing with no Ongoing Fees

What you'll get with your purchase

• Unrestricted use forever
• Instant access to 19 extensions
• 30 minutes of tech support
• 1 year of free upgrades

Customer reviews

Cory, animalkingdoms.co.nz

Alexander

Renaud

David

Ian Armstrong, londonbuses.co.uk

Submit your review

Magic Scroll Jsm

Make your website look fabulous with Magic Scroll!

Why choose Magic Scroll?

In the JavaScript slider market there are literally hundreds of options. So why should you choose Magic Scroll?

1. Constant updates. We regularly update Magic Scroll following the best technology trends, but at the same time we keep it compatible with old browsers.
2. It's fast. Magic Scroll avoids the pitfall that most sliders have - slow loading time. Vanilla JavaScript and CSS3 animations provide the best performance hands-down and lazy-loading helps your page load faster, with keeping all the eye-candy.
3. Support is always there for you. If you read our reviews you might have noticed how much our customers value our support. We take pride in your success, that's why we do our best to resolve every issue you might encounter.
4. No subscriptions and a money-back guarantee. Subscription pricing models are extremely popular today. In the long-term they are much much more expensive than the regular one-off payment model that we follow. It's very simple, you buy Magic Scroll - you get to keep it forever. Updates are free for a year. After that - it's only 20% of the initial price. Your purchase is absolutely risk-free thanks to our 30-day money-back guarantee.
5. Responsive out-of-the-box. Some sliders have problems on mobile devices. Magic Scroll doesn't. It automatically detects the viewport of your visitors device and adjusts the quantity of your slider items accordingly. Swipe gestures make it a breeze to navigate on mobile too, no more clicking that tiny little button to move to the next gallery item.

What's under the hood?

Magic Scroll is a vanilla JavaScript slider with CSS3 animations. We built a powerful API that allows developers do literally anything. If you don't know how to code, we have a simple configuration wizard which you can use to configure your Magic Scroll in literally seconds.

Today the odds are that you're using some sort of a CMS or an E-commerce platform. We have a Magento slider extension, WordPress slider plugin and integrations for other popular platforms. With our modules, installation is as easy as uploading and activating the module on your website.

Changelog

• • Fixed issue with non-working input text inside scroller.
• • Improved usage of array in the 'items' option
• • Core Java Script library update
• • Fixed error message in Edge browser
• • Addressed issue with calling refresh method
• • New API methods added: addItem, removeItem, getItem and getItems
• • Added <picture> tag support
• • Minor bug fixes
• • Enhanced scroll on swipe when 'step' parameter is defined for mobile.
• • Added ability to limit number of scroll image on mobile
• • Address Safari drag issue
• • Address issue with non-visible prev arrows when mouse wheel using for scroll
• • Fixed issue when API uses for scroll with non-loaded images
• • Fix MagicScroll.jump() method issue
• • Added onMoveStart callback for carousel mode
• • Minor bug fixes

• *Fixed issue with using jump() method with bullets

• • Improved scroll height calculation
• • Fixed issue with non-working jump() function when loop is disabled
• • Added fix for image size when height parameter is specified.
• • Fixed minor issues in the .stop() method.
• • Fixed wrong arrows position in IE
• • Address possible conflict with 3rd party CSS styles
• • beforeInit callback added
• • New CSS arrows
• • Fixes animation mode issue in Firefox browser.
• • Fix possible drag issue when items parameter contains array.
• • Fixes animation mode issue in IE browser.
• • Minor tweaks.
• • Fix caption position issue for cover flow effect.
• • Drag and drop functionality enhancement.
• • Minor bug fixes.

• Resolves a drag issue in Firefox 46.0

• • Resolves a issue when Scroll inside a form.
• • Small tweaks.
• • Lazy loading is now available in the cover-flow mode.
  • Ability to define a caption for the image with <figcaption> tag. E.g. <figure><img src='my-image.jpg'><figcaption>Image caption</figcaption></figure>.
• • Fixes a rare issue in the animation mode when total size of items exceeds 100,000 pixels.
• • New 'draggable' option that enables/disables drag to scroll.
  • Tweaks to the caption layout in carousel and cover-flow modes.
• • Preserve items state after browser resize in carousel and cover-flow modes.
• • Fixes an issue that could cause an incorrect display of the items in the scroll area in Firefox.
• • Resolves possible issue with a item caption defined via the tag.
• • Fixes an issue that prevented Magic Scroll from starting in Chrome on iOS.
• • Fix issue when Magic Scroll works over Magic Zoom (Plus) selectors and breaks image switching.
• • Maintenance release.
• • Small fixes.

• Announcing an extraordinarily flexible new version of Magic Scroll, with multiple applications on any website:

  • Fully responsive to perfectly resize itself.
  • Carousel mode for arranging images in 3D.
  • Cover-flow mode for flicking through tonnes of images.
  • Continuous scroll for non-stop images.
  • Swipe and drag support for maximum user control.
  • Mouse wheel and trackpad intelligence.
  • Dot navigation for moving forward/back.
  • CSS3 transitions with hardware acceleration.
  • Extended API and callbacks for greater JavaScript control.
  • Improved performance of visual effects.
• • Improve layout of 'Powered by' text, so it does not obscure the entire scroll.
• • Fix compatibility issue with MagicTouch.
• • Resolve possible conflicts with other JS libraries on the page.
• • Better compatibility with Magic Zoom Plus.
• • Fix issue with image size when scroller is running over Magic Zoom selectors.
• • Resolve issue with image loading in IE9.
• • Fix item size calculation.
  • Better compatibility with Magic Zoom and Magic Zoom Plus.
  • Other small fixes.
• • Resolve conflicts in IE.
• • Fix compatible issue with MagicThumb

• After 9 months development, our powerful new scroll tool has arrived. Using JavaScript and CSS, it works on all major browsers as well as iPad, iPhone and other mobile devices. Features include:

  • Scroll images, text, SWF and even scroll HTML content (i.e. anything).
  • Change direction.
  • Adjust speed.
  • Choose effects.
  • Choose arrows.
  • Automatic or manual scroll.
  • Adjust margin and padding.
  • Adjust colors.
  • Click to URL.

Choose your Platform

Magic Scroll Js

Or Download the Vanilla JS version