CODEWITHSUNDEEP
javascripthtmlcssimage
Nik
Nik

Reputation: 695

Image tag style.height not overriding css class height?

Css

.myStyle {
height: 10px;
background-image: url(../myImage.png);
}

html

<img class=myStyle src=<%scriptlet%> >

Now the problem is in my js, i have written a error handler for this img tag, which would set the height to 0px. This 0px comes as style.height=0px but does not override height of class myStyle.

js

myImage = $('.myStyle', $el);
myImage.error(function () {
           myImage.attr('style.height', '0px');
});

Upvotes: 1

Views: 382

Answers (4)

Sudhir Bastakoti
Sudhir Bastakoti

Reputation: 100175

change:

myImage.attr('style.height', '0px');

to

myImage.css('height', '0');

To get background image, you can use getting, like

myImage.css("background");

OR

myImage.css("backgroundImage")

Upvotes: 4

Aarif Qureshi
Aarif Qureshi

Reputation: 474

myImage.style.height = '0px';

This will also work.

Upvotes: 0

Eliran Malka
Eliran Malka

Reputation: 16263

Use this:

myImage.height(0);

Instead of:

myImage.attr('style.height', '0px');

The attr() is made for attribute manipulation, so in order for the later declaration to work, you may also change it to:

myImage.attr('style', 'height: 0px;');

See attr() on the jQuery docs.

Upvotes: 1

Vishal Suthar
Vishal Suthar

Reputation: 17194

Use this instead:

myImage.height('10px');

Upvotes: 0

Related Questions