CSS Image Shadow Effect On Blogger And Wordpress

Add This To Del.icio.us Tweet/ReTweet This Share on Facebook StumbleUpon This Add to Technorati Digg This

Effect is something that makes a thing more beautiful than ever. Image shadow effect is a effect which has a impact on images. This CSS effect works on both blogger and wordpress platform. I have already provided demo. You first see then decide. How ever this effect function greatly in blogger

View a demo

On Blogger

Log in to your blogger account and Go to Design → Page Element

Click Add Gadget and select 'HTML/Javascript'

Now paste the following code with image

<a href="http://www.edutechnology.net" target="_blank">
<img src="http://3.bp.blogspot.com/-PEwsXjTq2iI/T2GKZVhWROI/AAAAAAAAAO0/cdfQH3yiGsg/s1600/goku2.jpg" style="opacity:0.4;filter:alpha(opacity=40)"
onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"
onmouseout="this.style.opacity=0.4;this.filters.alpha.opacity=40" />
</a>

Now save and see

How To Use

Well you can use images with this effect in direct blogger post. Just follow the following code formation

<a href=" your link" target="_blank">
<img src="your image link" style="opacity:0.4;filter:alpha(opacity=40)"
onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"
onmouseout="this.style.opacity=0.4;this.filters.alpha.opacity=40" />
</a>

I hope you already understand

On Wordpress

In wordpress this effect does not work properly. There is some change in the code

<center><a href="your link" target="_blank">
<img src="your image link" style="opacity:0.4;filter:alpha(opacity=40)"
</a></cenyer><br>

You can directly put this in your wordpress post like me

Enjoyed this article ? Please share if so. We need your appreciation to continue and thank you

Tweet

Effect is something that makes a thing more beautiful than ever. Image shadow effect is a effect which has a impact on images. This CSS effect works on both blogger and wordpress platform. I have already provided demo. You first see then decide. How ever this effect function greatly in blogger View a demo On Blogger Log in to your blogger account and Go to Design → Page Element Click Add Gadget and select 'HTML/Javascript' Now paste the following code with image <a href="http://www.edutechnology.net" target="_blank"> <img src="http://3.bp.blogspot.com/-PEwsXjTq2iI/T2GKZVhWROI/AAAAAAAAAO0/cdfQH3yiGsg/s1600/goku2.jpg" style="opacity:0.4;filter:alpha(opacity=40)" onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100" onmouseout="this.style.opacity=0.4;this.filters.alpha.opacity=40" /> </a> Now save and see How To Use Well you can use images with this effect in direct blogger post. Just follow the following code formation <a href=" your link" target="_blank"> <img src="your image link" style="opacity:0.4;filter:alpha(opacity=40)" onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100" onmouseout="this.style.opacity=0.4;this.filters.alpha.opacity=40" /> </a> I hope you already understand On Wordpress In wordpress this effect does not work properly. There is some change in the code <center><a href="your link" target="_blank"> <img src="your image link" style="opacity:0.4;filter:alpha(opacity=40)" </a></cenyer><br> You can directly put this in your wordpress post like me Enjoyed this article ? Please share if so. We need your appreciation to continue and thank you