Aug 9, 2022
0
Level 2
I want to shorten the Javascript Code or Convert it into Angular Js
I'm making a project in Angular Js. I have this code which is working fine for me but its too long comparing to the functionality. I want to shorten the code as much as possible. Or I want to make this code recommended by Angular Js if possible.
var m1 = $("#mouse1");
var m2 = $("#mouse2");
var m3 = $("#mouse3");
var p1 = $("#page1");
var p2 = $("#page2");
var p3 = $("#page3");
m1.mouseover(function() {
p1.css('display', 'block');
p2.css('display', 'none');
p3.css('display', 'none');
m2.removeClass('active');
m3.removeClass('active');
});
m2.mouseover(function() {
p2.css('display', 'block');
p1.css('display', 'none');
p3.css('display', 'none');
m1.removeClass('active');
m3.removeClass('active');
});
m3.mouseover(function() {
p3.css('display', 'block');
p1.css('display', 'none');
p2.css('display', 'none');
m1.removeClass('active');
m2.removeClass('active');
});
p1.mouseover(function() {
m1.addClass('active');
});
p2.mouseover(function() {
m2.addClass('active');
});
p3.mouseover(function() {
m3.addClass('active');
});
All The Div blocks are separate from each other and their is no parent or children Divs.
Please or to participate in this conversation.