you may use it to shoe advts ,rss feeds or whaterer you want and link it too
Here is the hack to do so..
just follow the steps they are short and sweet
Just login to Blogger,
Go To Layout > Edit Html > Press Ctrl + F[find]
Now place these codes above it
<style type='text/css'>
img { behavior: url(iepngfix.htc) }
#pageflip {
position: relative;
right: 0; top: 0;
float: right;
}
#pageflip img {
width: 50px; height: 52px;
z-index: 99;
position: absolute;
right: 0; top: 0;
-ms-interpolation-mode: bicubic;
}
#pageflip .msg_block {
width: 50px; height: 50px;
overflow: hidden;
position: absolute;
right: 0; top: 0;
background: url(http://www.astro.wisc.edu/~townsend/resource/news/rss.jpg) no-repeat right top;
}
</style>
<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
//Page Flip on hover
$("#pageflip").hover(function() {
$("#pageflip img , .msg_block").stop()
.animate({
width: '307px',
height: '319px'
}, 500);
} , function() {
$("#pageflip img").stop()
.animate({
width: '50px',
height: '52px'
}, 220);
$(".msg_block").stop()
.animate({
width: '50px',
height: '50px'
}, 200);
});
});
</script>
Red line is the image you want to show
Now search for
place the following code after it
<div id='pageflip'>
<a href='http://feeds2.feedburner.com/widgetblogger'><img alt=''
src='http://www.wallheaven.com/page_flip.png'/></a>
<div class='msg_block'></div>
</div>
Thats all and you have your peel over image effect, enjoyy and any problem then commentme.....!!!)
2 comments:
thanks for the post, i have been looking for this for a long time.
Thanks for such very great information. This is the best sites for proving such kinds of good information.PUNJAB PG MEDICAL ADMISSION 2017
Post a Comment