jQuery Shining Image

jQuery Shining Image

The Power of jQuery Shining Image Effect

Introduction to jQuery Shining Image

jQuery Shining Image is a powerful plugin that adds a shining effect to your images. This effect can make your images stand out and grab the attention of your website visitors. It’s a great way to add a touch of style and elegance to your website design.

How to Use jQuery Shining Image

Using jQuery Shining Image is quite simple. You just need to include the jQuery library and the Shining Image plugin in your HTML file. Once you have done that, you can apply the shining effect to your images using a few lines of jQuery code. You can customize the strength and direction of the shining effect to fit your design needs.

Benefits of jQuery Shining Image

There are several benefits to using jQuery Shining Image. First and foremost, it can make your images look more eye-catching and visually appealing. This can help to improve the overall appearance of your website and make it more engaging for your visitors. Additionally, the shining effect can help to draw attention to specific images or elements on your website, helping to highlight important information or calls to action.

Examples of jQuery Shining Image in Action

There are many websites that make use of jQuery Shining Image to enhance their design. You can see examples of this effect used in online portfolios, product showcases, and promotional banners. The shining effect can be subtle or dramatic, depending on the style of the website and the desired impact.


jQuery Shining Image is a versatile and powerful plugin that can add a touch of glamour and sophistication to your website. Whether you want to highlight a specific image or simply make your website more visually appealing, this effect can be a valuable addition to your design toolkit.

1. What is jQuery Shining Image?

jQuery Shining Image is a plugin that creates a shining effect on an image when the mouse hovers over it. It adds a glowing effect to the image, making it stand out and capture the user’s attention.

2. How do I use jQuery Shining Image?

To use jQuery Shining Image, you first need to include the jQuery library and the Shining Image plugin script in your HTML file. Once that is done, you can apply the shining effect to an image by selecting it using jQuery and calling the .shiningImage() method on it.

3. Can I customize the shining effect?

Yes, you can customize the shining effect to match your website’s design. jQuery Shining Image provides options to adjust the intensity, color, and duration of the shining effect. You can also specify whether the shining effect should start automatically or be triggered by a specific event.

4. Is jQuery Shining Image responsive?

Yes, jQuery Shining Image is responsive and works on all devices, including desktops, tablets, and mobile phones. The shining effect remains consistent across different screen sizes, ensuring a seamless user experience.

5. Can I use jQuery Shining Image with other jQuery plugins?

Yes, jQuery Shining Image is compatible with other jQuery plugins. You can integrate it into your existing jQuery-based projects and combine it with other plugins to create unique and interactive user interfaces.

6. How do I get support for jQuery Shining Image?

If you have any questions or encounter issues while using jQuery Shining Image, you can refer to the official documentation and examples provided by the plugin author. Additionally, you can seek help from the jQuery community forums and Q&A websites to get assistance from experienced developers.

jQuery Shining Image is an HTML5 jQuery plugin that add an animated shining effect to your images.

This plugin use canvas element, and is compatible with all computer and mobiles modern browsers. For the others, the image keeps its default static look.

  • Very easy to use : $(‘img’).shiningImage()
  • Many options to customize the effect
  • Can be used with lightbox, using onComplete Event
  • The shining image keeps the default style and class.
  • The shining image keeps original image click, mouseover, mouseout, mouseup and mousedown events
  • Compatibility : IE9+ , Firefox 4+ , Google Chrome 11+, Opera 10.6+, Safari 3.2+

Plugin parameters list :

  • color : Sets the effect color
  • delay : Sets the delay between each shine effect
  • direction : Sets the effect direction. Horizontal, vertical or diagonal
  • onComplete : Execute this function after plugin initialisation
  • onLoopComplete : Execute this function after each shine effect
  • opacity : Sets the effect opacity
  • playOnLoad : Automatically start effect or not
  • scale : Sets the effect scale. 1 = 30% of image width or height
  • speed : Sets the effect speed in ms


  • .data(‘shiningImage’).shine() : Start shine effect
  • .data(‘shiningImage’).stopshine() : Stop shine effect















You must log in to submit a review.

Leave a Reply

Your email address will not be published. Required fields are marked *

Shopping Cart
Scroll to Top