Simple Mouseover Effect Code For Images

Simple Mouseover Effect Code For Images

Here are the codes:

• If you have to place image with mouseover effect through "Add & Arrange Page Elements" section on Blogger use this code (this code may work on IE);

Code:

<img alt='Image01' onmouseover="this.src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEXsnV-3GPcAt_U12mNcwXYLQdBTQnA8DHUN2dEIp299QdP_tjX5e5ZcP5_f2Vtc9xdUiVW8qK3WTcXz4ZbqhKroyOIpZg6VJ3tegAXgS2f7SlTrmrGNEfevBvk2GNV4aSSWFXMTaRYUiK/s1600/Image+5.png'" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEii9k1QoIvM-8qMn-ecXhuhp0RrVwGIjp89L5rmbfIqKi_CIsgIJCVqCHzzR3seuEVgTZtSkJKi87MXGCthGV-QpkuiZ4F7yxAJQo86TgimBblYhBkRo-qFhsqjly5T-fH8KVXgofoPFCHS/s1600/Image+4.png" onmouseout="this.src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEii9k1QoIvM-8qMn-ecXhuhp0RrVwGIjp89L5rmbfIqKi_CIsgIJCVqCHzzR3seuEVgTZtSkJKi87MXGCthGV-QpkuiZ4F7yxAJQo86TgimBblYhBkRo-qFhsqjly5T-fH8KVXgofoPFCHS/s1600/Image+4.png'" />

• If you have to place image with mouseover effect through "Edit HTML" section on Blogger use this code (this code may not work on IE);

Code:

<img alt='Image01' onmouseout='this.src=&amp;apos;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEii9k1QoIvM-8qMn-ecXhuhp0RrVwGIjp89L5rmbfIqKi_CIsgIJCVqCHzzR3seuEVgTZtSkJKi87MXGCthGV-QpkuiZ4F7yxAJQo86TgimBblYhBkRo-qFhsqjly5T-fH8KVXgofoPFCHS/s1600/Image+4.png&amp;apos;' onmouseover='this.src=&amp;apos;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEXsnV-3GPcAt_U12mNcwXYLQdBTQnA8DHUN2dEIp299QdP_tjX5e5ZcP5_f2Vtc9xdUiVW8qK3WTcXz4ZbqhKroyOIpZg6VJ3tegAXgS2f7SlTrmrGNEfevBvk2GNV4aSSWFXMTaRYUiK/s1600/Image+5.png&amp;apos;' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEii9k1QoIvM-8qMn-ecXhuhp0RrVwGIjp89L5rmbfIqKi_CIsgIJCVqCHzzR3seuEVgTZtSkJKi87MXGCthGV-QpkuiZ4F7yxAJQo86TgimBblYhBkRo-qFhsqjly5T-fH8KVXgofoPFCHS/s1600/Image+4.png'/>

In the above codes replace the RED texts with the URL of the main image and the BLUE texts with the URL of the hover image.