1.0.1 • Published 3 years ago

parallax-mouse v1.0.1

Weekly downloads
-
License
MIT
Repository
github
Last release
3 years ago

parallax-mouse.js 🔥

npm.io npm.io npm.io npm.io npm.io

Simple parallax elements for the mouse. Pure JavaScript.

Installation

Using the CDN
  1. Add <script src="https://cdn.jsdelivr.net/npm/parallax-mouse@1.0.0/dist/parallax-mouse.min.js"></script> to your markup
  2. Done!
Download file
  1. Download file
  2. Copy the code and paste into your project.
  3. Done!
NPM

npm install parallax-mouse --save

Getting started

Tag script

<body>
	<div class="parallax">
		<img src="http://placehold.it/50x50" class="cherry" alt="">
	</div>
	<!-- /.parallax -->
	
	<script src="https://cdn.jsdelivr.net/npm/parallax-mouse@1.0.0/dist/parallax-mouse.min.js"></script>
	<script>
		parallaxMouse({ elements: '.cherry', moveFactor: 10, wrap: '.parallax', perspective: '100px' })
	</script>
</body>

ES6

import { parallaxMouse } from 'parallax-mouse/dist/parallax-mouse.min.js'

parallaxMouse({ elements: '.cherry', moveFactor: 10, wrap: '.parallax', perspective: '100px' })

Options

NameDefault valueDescription
elementsnullElements to be involved
moveFactor5Scatter level of elements
wrap.containerWrapping elements (listens to mouse event)
perspectivefalseNeeded if you want 3D effect of the elements. By Required in string format. For example, perspective: '500px'

Support or Contact

To contact me, write to me by mail: 013131@mail.ru