Hii,
As we all know that for mobile and tablet screen hover effect doesn't works so we need to remove all hover effects provided after window screen width 768px.It's very simple using Jquery.Just go through the following steps.
Step 1:Make sure that all the hover effects you have provided to a particular content is within a class.
Example:
div.tab:hover{//properties} It should be like this.
div:hover{//properties}It should not be like this.
Step 2:Now remove that class within which you have provided hover properties.
Here's the Jquery Code for removing hover effect:
$(document).ready(function(){
$(window).resize(function() {
$window = $(window);
if ($window.width() <= 768) {
$("div").addClass("NewTab"); //add a new class
$("div").removeClass("tab"); //remove that class in which you have provided hover effect
}
else {
$("div").addClass("tab");
}
});
});
1 Comment(s)