jQuery Hover3d

jQuery Hover3d is a simple hover script for creating 3d hover effect. It was my experiment on exploring CSS3 3d transform back in 2015 on Codepen 3D hover plane effect. The idea is to transform the element into 3d space using CSS3 transform, playing with translateZ for spacing the elements, and detecting mouse movement to change the transform value.

Features

Check out the demo
Include jQuery, and jquery.hover3d.min.js within your HTML
There is no special CSS file to be included, you can write your own CSS and playing with transform on child elements
All browser that support 3d transform and perspective
It was my experiment on exploring CSS3 3d transform back in 2015 on Codepen 3D hover plane effect
The idea is transforming the element into 3d space using CSS3 transform, playing with translateZ for spacing the elements

Project Samples

Project Activity

See All Activity >

License

MIT License

Follow jQuery Hover3d

jQuery Hover3d Web Site

Other Useful Business Software

Run applications fast and securely in a fully managed environment

Cloud Run is a fully-managed compute platform that lets you run your code in a container directly on top of scalable infrastructure.

Run frontend and backend services, batch jobs, deploy websites and applications, and queue processing workloads without the need to manage infrastructure.

Try for free

Rate This Project

User Reviews

Be the first to post a review of jQuery Hover3d!

Additional Project Details

Programming Language

JavaScript

Related Categories

JavaScript Libraries

Registered

2023-09-27

Similar Business Software

Three.js

Three.js is a JavaScript 3D library. The aim of the project is to create an easy-to-use, lightweight, cross-browser, general-purpose 3D library. The current builds only include a WebGL renderer but WebGPU (experimental), SVG and CSS3D renderers are also available in the examples. To actually be...

See Software
Verge3D

Verge3D® is a powerful and intuitive toolkit that allows Blender, 3ds Max, or Maya artists to create immersive web-based experiences. Verge3D can be used to build interactive animations, product configurators, engaging presentations of any kind, online stores, explainers, e-learning content,...

See Software
Screenfull.js

Simple wrapper for cross-browser usage of the JavaScript Fullscreen API, which lets you bring the page or any element into fullscreen. Smoothens out the browser implementation differences, so you don't have to. If you cannot use ESM or need to support older browsers without using transpilation,...

See Software
Velocity.js

Velocity is an animation engine with the same API as jQuery's animate. It works with and without jQuery. It's incredibly fast, and it features color animation, transforms, loops, easings, SVG support, and scrolling. It is the best of jQuery and CSS transitions combined. Download Velocity,...

See Software
jQuery

jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers. If you're new to jQuery. Return a collection of matched...

See Software
Anime.js

Anime.js is a lightweight JavaScript animation library with a simple, yet powerful API. It works with CSS properties, SVG, DOM attributes, and JavaScript Objects. Follow through animations made easy. Anime's built-in staggering system makes complex follow-through and overlapping animations...

See Software

Report inappropriate content