» » scrolling effect

 
Sort articles by: Date | Most Rates | Most Views | Comments | Alphabet

Pin the HTML5 video player to the bottom right corner of the page when the page scrolls

Author: bamboo06 on 7-04-2019, 01:06, views: 4754

0 On a page with video playback, sometimes we need to scroll the page to view video-related content information, such as profiles, related comments, etc., then when scrolling the page, the video player will leave the window area, this time we can use JS and CSS technology will The player toggle is fixed to the bottom right corner of the page.
Pin the HTML5 video player to the bottom right corner of the page when the page scrolls

Use jquery to detect the scrolling event of the window and switch the videoBox's class class to the appropriate position to hide and appear in the lower right corner.

Category: Javascript / CSS

 

Fixed background and scrolling page effect with CSS

Author: bamboo06 on 13-08-2016, 01:54, views: 9005

7 How to create a just simply and none requiring javascript and CSS property of background-attachment can be realized fixed page backgrounds and scrolling effect. We see that there are many project sites use parallax effect, parallax is generated by the dynamic changes and the background image and js script, but today we only need CSS.
Fixed background and scrolling page effect with CSS

HTML structure is very simple, a background image is fixed placement class .cd-fixed-bg div element for a class of .cd-scrolling-bg div element portion for scrolling. We can place multiple .cd-fixed-bg and .cd-scrolling-bg group.

Category: CSS

 

use jQuery to realize pushing down scrolling effect of graphic information

Author: bamboo06 on 4-12-2014, 02:45, views: 2086

2 WEB page of the site need to show the latest information, such as microblogging dynamic, more than ticket information, traffic monitoring and other projects in common, real-time data scrolling effect, we can use jQuery to implement front-end information scrolling effect. In this article we will explain with an example for everyone to realize how to use jQuery scrolling effect graphic information.
use jQuery to realize pushing down scrolling effect of graphic information

Category: Javascript

 

Create a parallax scrolling effect using Skrollr page

Author: bamboo06 on 3-11-2014, 01:50, views: 5937

4 Parallax scrolling refers to a multi-layer background move at different speeds, the formation of three-dimensional motion effects, bringing excellent visual experience. As users of the increasing demands of visual experience, WEB developers to start adding various special effects elements in web pages to meet the needs of users. Today, this article has given you recommend a good parallax animation javascript library --Skrollr.js
Create a parallax scrolling effect using Skrollr page

Skrollr is a use of HTML5 and CSS3 parallax scrolling lightweight javascript library. It is not dependent on the independent libraries of other frameworks that lets you quickly create a parallax scrolling effect. It allows us to set the CSS property keyframes to any element, then it will automatically form animation. The more important point is that the use of these libraries do not write complex JS code and compatible with mainstream browsers, mobile phones and other mobile terminal adapter and other features.

Category: Javascript / CSS / HTML5 / Plugins

 

Use flexslider to create picture carousel, combining text and graphics slide transition/scrolling effects

Author: bamboo06 on 2-11-2014, 03:28, views: 8190

8 Flexslider is based on a rolling jQuery plugin content. It allows you to easily create content scrolling effect, with a very high customizability. Developers can easily create a variety of images using Flexslider carousel effect, the effect of the focus map, Text and graphics scrolling effect.
Use flexslider to create picture carousel, combining text and graphics slide transition/scrolling effects

Flexslider has the following features.

Category: Javascript / Plugins