Hello, I'm currently attempting to implement a CSS Style on an <img> tag that does not have any assigned class or id. Below is my code snippet:
===CSS===
.tgll-navi { //custom class for navigation bar
.navi-left { //.navi-left
float:right;
text-align:center;
} // end .navi-left
img { // img
max-height:269px !important;
max-width:524px !important;
height:75%;
width:75%;
padding:7px;
background-color:white;
border-style:solid;
border-color:black;
border-width:4px;
} // end img
.scale { // scale
max-width:174px !important;
max-height:89px !important;
height:25%;
width:25%;
padding:3px;
background-color:grey;
border-style:solid;
border-color:black;
border-width:2px;
}// end scale;
}// end tgll-navi class
=== jQuery Code ===
$(window).scroll(function() {
var scroll = $(window).scrollTop();
if (scroll >= 5) {
$('img[src="http://gourmetlunchladies.com/new/wp-content/uploads/2016/02/image3355.png"]').addClass(".scale");
} else {
$('img[src="http://gourmetlunchladies.com/new/wp-content/uploads/2016/02/image3355.png"]').removeClass(".scale");
}
});
I've checked the JavaScript console.log and no errors are present. An alert message pops up when added after the .addClass function, indicating that it should be applying the class. However, upon removing the alert, the class does not seem to be applied as intended.
I am working on a WordPress site with DMS2, all components are updated to their latest versions.
If you know me, I probably just missed a period or semi-colon somewhere in the code!
Sincerely, Brent Higgs