HTML CSS JQuery

The answer you seek is that the animation increases the size of the <img> which pushes the padding out and the border as well. With your code “as is” you need to set a height and width on your div.stable greater than the maximum size after animation. Here is a pic of your pen with an exaggerated size for your exploration.


Notice also that in your javascript window I changed your selector from li img to img. div img also works. I mention this because you have a <div> as a child of <ul> and an <li> as a child of a <div>. Both of which should not be.
jquery ui is using a ‘div’ as the basis for your widget, knowing that, you should be able to correct your HTML with the JS still working. PS some of your script is returning undefined.

1 Like