public marks

PUBLIC MARKS from decembre with tag scroll

2018

JAVASCRIPT / CSS - DEMO - Scrolling Letters Animation | Codrops

A switching title effect where a fixed text element changes with an animation depending on the scroll position.The animations are powered by anime anime.js. We also use imagesLoaded for preloading the images and Charming.js for the handling the letter structure of the titles.

2017

JAVASCRIPT - Infinite Scroll - 'infinite-scroll' Questions - Page 2 - Stack Overflow

Tagged Questions: Infinite Scrolling, also known as endless scrolling, is a technique that is widely used by websites and Web applications that host lots of content on a page where pagination would traditionally have been used. Infinite scrolling involves initially loading only one page of content. As the user ...

CSS - CODE EXAMPLE - "Progress bar horizontal" qui varie suivant le scroll

In AlsaCreation : CODE EXAMPLE -" Progress bar horizonta"l qui varie suivant le scroll body { -moz-box-direction: normal; -moz-box-orient: vertical; background: #f3f3f3 none repeat scroll 0 0; color: #000; display: flex; flex-direction: column; font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; font-size: 1.6rem; min-height: 100vh; }

jQuery - javascript - JS scrollbar recommendations? - Stack Overflow

by 1 other
I like to use: - Tiny Scrollbar for the minimalist design - JQuery Custom Content Scroller

jQuery - LIBRARY - SCROLL - jQuery custom content scroller – malihu | web design

by 1 other (via)
(Last updated on Jul 11, 2016 ) Highly customizable custom scrollbar jQuery plugin. Features include: - vertical and/or horizontal scrollbar(s) - adjustable scrolling momentum - mouse-wheel (via jQuery mousewheel plugin) - keyboard and touch support - ready-to-use themes and customization via CSS - RTL direction support - option parameters for full control of scrollbar functionality - methods for triggering actions like scroll-to - update, destroy etc - user-defined callbacks and more.....

jQuery - LIBRARY - SCROLL - Tiny Scrollbar: A crossbrowser lightweight Javascript / jQuery scrollbar.

What is it? Tiny Scrollbar is a nice and elegant way to enable the scrolling of content on mobile and desktop devices. Its designed to be a dynamic lightweight utility. Furthermore it gives a User Interface Designer a powerful way of enhancing the Ui (user interface) of a website. It comes in 2 flavours as a vanilla Javascript microlib and as a jQuery plugin. Browser support differs between the jQuery plugin and the plain Javascript microlib. Specifically, the plain Javascript microlib does not support legacy browsers such as IE6-8. Use the jQuery plugin release if support for those browsers is required. Source is on GitHub

SCROLL - Responsive YouTube Player with Scrolling Thumbnail Playlist - Wooster Web Design

(via)
Responsive YouTube Player with Scrolling Thumbnail Playlist In this post we will work with an embedded YouTube video player using YouTube’s iframe embed code. Below the iframe we’ll add a horizontal playlist that includes a thumbnail image and title for each video. The playlist will scroll or slide left and right on click or tap. The player we are building in this is based on the MyList Video Player, but instead of automatically populating with a YouTube playlist, we are manually building our own playlist of selected YouTube videos.

SCROLL - Zoom sur l'effet parallaxe - Alsacreations

Qu'est-ce que l'effet parallaxe ? Il s'agit d'un terme générique correspondant au déplacement de plusieurs éléments sur des couches et à des vitesses différentes. Au scroll (défilement de la vue) ou en fonction des coordonnées de la souris, les positions des différents fonds (ou éléments à animer) vont changer, ce qui va générer un effet de profondeur. Ce principe concerne au minimum deux éléments et peut être appliqué à plusieurs endroits : sur les images de fond, sur un en-tête ou un pied de page, sur des images... etc.

2015

CSS3 - SCROLL - NEW - Native CSS Scroll Snap Points | CSS-Tricks

The newly-introduced CSS “snap points” properties could make it a whole lot easier to create CSS-only scroll effects (once browser support catches up). This post from Sergey Gospodarets' blog includes demos of snappy scrolling for image galleries and full-page vertical scrolling.

jQuery - Infinite Scroll - jQuery One Page Navigation Plugin | Trevor Davis | Front-End Developer @ Viget

(via)
When appropriate, I am a fan of the one-page sites. I really like the ones that add smooth scrolling and highlight the navigation depending upon which part of the page you have scrolled to.

INFINITE SCROLL - jQuery - Reset / disable infinite scroll after AJAX call - Stack Overflow

I am using infinite-ajax-scroll (https://github.com/webcreate/infinite-ajax-scroll) plugin with filtering. I have the filters working with the infinite scroll but my issue is, whenever the scroll get the the end of the results for one filter it will no longer scroll, even after another filter is selected. I therefore need to reset the infinate scroll when the filter is selected but I cannot find anywhere in the documentation on how to reset this and am not great with JQuery and so cannot figure this out.

INFINITE SCROLLING - To Infinite Scroll or Not to Infinite Scroll: Where We’ve Come So Far | Design Shack

In fact, infinite scrolling was removed from the site after the number of clicks on favorites decreased and the search function was not used anymore.

2013

CSS - TRICKS - Vitesse de réaction : Retirer du body la classe hover LORS du défilement - 60fps scrolling using pointer-events: none | The CSS Ninja - All things CSS, JavaScript & HTML

by 1 other
L'essentiel de la technique est de retirer la classe hover du body LORS du défilement et tous vos . hover sélecteurs ne correspond pas jusqu'à ce que l'utilisateur cesse de faire défiler la page , la classe étant alors ajoutée a body. About avoiding unnecessary paints through disabling hover effects as the user scrolls, which is a great approach. The down side being managing all your hover states through a parent class.

decembre's TAGS related to tag scroll

>Jquery +   analyse +   animation +   blog +   browser +   code +   css +   demo +   design +   dev +   défilement +   documentation +   example +   exemple +   flex +   forum +   hover +   image +   infinite-scroll +   infinite-scrolling +   interface +   javascript +   jQuery +   library +   masonry +   mobile +   mouse +   navigation +   optimiser +   pagination +   parallaxe +   player +   plugin +   position +   progress bar +   scrollbar +   search +   site +   souris +   style +   transform +   tricks +   truc +   tuto +   tutorial +   tutoriel +   Tympanus +   user +   video +   web +   youtube +