The Big Spring Sale! Up to 50% off!

Mouse Over possible right now?

info15103
6 Posts
info15103 posted this 13 January 2023
Ask a Question

Hi there,
I like to get the following effect: i.e. a product picture is a black&white pic, when moused over it turns into a color pic. Simply said: standard: b/w pic, hovered same pic but in color. This should be possible with Nicepage but I cannot find a way to do this. A great creative possiblitiy.
Thanks for your help!
Stefan

Hi there, I like to get the following effect: i.e. a product picture is a black&white pic, when moused over it turns into a color pic. Simply said: standard: b/w pic, hovered same pic but in color. This should be possible with Nicepage but I cannot find a way to do this. A great creative possiblitiy. Thanks for your help! Stefan
Vote to pay developers attention to this features or issue.
4 Replies
Order By: Standard | Newest
Support Team
Support Team posted this 15 January 2023

Hi, Stefan,

In Nicepage, we added the Hover Slider Element that has such a possibility.

enter image description here

However, it is not possible to do with the product Elements. We have added this feature to our wishlist.

Let us know if you need our further help!
...................................................
Sincerely,
Paul C.
Nicepage Support Team

Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1
Follow us on Facebook: http://facebook.com/nicepageapp

Hi, Stefan, In Nicepage, we added the **Hover Slider Element** that has such a possibility. ![enter image description here][1] However, it is not possible to do with the product Elements. We have added this feature to our wishlist. Let us know if you need our further help! ................................................... Sincerely, Paul C. Nicepage Support Team Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1 Follow us on Facebook: http://facebook.com/nicepageapp [1]: https://i.imgur.com/zdKYeU4.png
info15103
6 Posts
info15103 posted this 15 January 2023

Hey Paul,
thanks a lot!

Hey Paul, thanks a lot!
Support Team
Support Team posted this 15 January 2023

Hi, Stefan,

You're welcome! Feel free to contact us whenever you need.
...................................................
Sincerely,
Paul C.
Nicepage Support Team

Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1
Follow us on Facebook: http://facebook.com/nicepageapp

Hi, Stefan, You're welcome! Feel free to contact us whenever you need. ................................................... Sincerely, Paul C. Nicepage Support Team Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1 Follow us on Facebook: http://facebook.com/nicepageapp
daniellenel.ms03.199.2
1 Posts
daniellenel.ms03.199.2 posted this 28 January 2023

Yes, it is possible to create a "mouse over" effect with JavaScript and jQuery.

Here's an example of how to do this:

First, include the jQuery library in your HTML file by adding the following code in the head section:

Next, create an HTML element (for example, a div) that you want to trigger the mouse over effect on:
<div id>Hover over me</div>
Then, use jQuery to listen for the mouseover event on the element and perform an action when it is triggered. For example, you could change the background color of the element when the mouse is over it:

$("#myDiv").on("mouseover", function() {
$(this).css("background-color", "blue");
});

You can also use the mouseout event to perform an action when the mouse leaves the element, like this:

$("#myDiv").on("mouseout", function() {
$(this).css("background-color", "white");
});

You can add any type of effect or action to be performed when the mouse is over an element or when it leaves it.

You can also use the :hover pseudo-class in CSS to achieve the same effect, which allows you to style an element when the user hovers over it.

myDiv:hover {

background-color: blue;
}

myDiv:hover {

background-color: blue;
}

This is a concise way to achieve the hover effect, but it doesn't have the flexibility that the javascript solution offers.

Yes, it is possible to create a "mouse over" effect with JavaScript and jQuery. Here's an example of how to do this: First, include the jQuery library in your HTML file by adding the following code in the head section: Next, create an HTML element (for example, a div) that you want to trigger the [mouse over][1] effect on: &lt;div id&gt;Hover over me&lt;/div&gt; Then, use jQuery to listen for the mouseover event on the element and perform an action when it is triggered. For example, you could change the background color of the element when the mouse is over it: $("#myDiv").on("mouseover", function() { $(this).css("background-color", "blue"); }); You can also use the mouseout event to perform an action when the mouse leaves the element, like this: $("#myDiv").on("mouseout", function() { $(this).css("background-color", "white"); }); You can add any type of effect or action to be performed when the mouse is over an element or when it leaves it. You can also use the :hover pseudo-class in CSS to achieve the same effect, which allows you to style an element when the user hovers over it. #myDiv:hover { background-color: blue; } #myDiv:hover { background-color: blue; } This is a concise way to achieve the hover effect, but it doesn't have the flexibility that the javascript solution offers. [1]: https://macrotester.com/butterfly-click-test/

Last edited 29 January 2023 by daniellenel.ms03.199.2

You must log in or register to leave comments