Pages

Wednesday, April 4, 2018

Creating A blur effect in All Photos In blogger With Jquery Effects

Creating A blur effect in All Photos In blogger With Jquery Effects



Creating a Blur Effect All Photo In Blog With JQuery Effects.In this post I will give you trick that will explain how to create the effect of all the photos on the blog with JQuery effects, when you place your cursor over the picture. Then the blur effect that by itself appears. This time make the image blur can apply in your blog.

Procedure:

1.In your dashboard click Layout > Edit Html
2.Find a piece of code </head> following in the Html
(Click Ctrl and F to the search bar to help find the code)
3.Copy and paste the following code Directly Before / Above </head>

<script src=http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js type=text/javascript/>
<script type=text/javascript>
$(document).ready(function(){
$(".post img").fadeTo("slow", 1.0); // This sets the opacity of the thumbs to fade down to 30% when the page loads
$(".post img").hover(function(){
$(this).fadeTo("slow", 0.5); // This should set the opacity to 100% on hover
},function(){
$(this).fadeTo("slow", 1.0); // This should set the opacity back to 30% on mouseout
});
});
</script>
<script type=text/javascript>
$(document).ready(function(){
$(".latest_img").fadeTo("slow", 1.0); // This sets the opacity of the thumbs to fade down to 30% when the page loads
$(".latest_img").hover(function(){
$(this).fadeTo("slow", 0.5); // This should set the opacity to 100% on hover
},function(){
$(this).fadeTo("slow", 1.0); // This should set the opacity back to 30% on mouseout
});
});
</script> 


Now, Save Template and Enjoy... 


visit link download
Posted by at

No comments:

Post a Comment

Note: Only a member of this blog may post a comment.

Subscribe to: Post Comments (Atom)