Wednesday, 11 July 2018

How To Create Enlarged Post Image When Touched Mouse Cursor

Good night buddy readers, this time I will share tips & tricks. How to make an image post enlarged when touched the mouse cursor. There are so many ways to beautify the post image of a blog that we have, one of them by enlarging the image of the post when touched by the mouse cursor. Images that disebuah page or post content of a blog is a picture for the guide sipembaca to easily follow the steps of a tutorial on a blog post. Therefore, the reader without bothering to click the image on the post just to mezoom / enlarge the image. Here sipembaca just point the mouse cursor to the image, automatically the image will immediately mengezoom / enlarge by itself.


To make the image post enlarged when touched the mouse cursor by itself it's easy kok sob, we just copy paste the script code to Edit HTML in Theme / Template blog. For more details, follow the steps as follows.

Also read:
1. How to Find Code Script in Edit HTML Template BLOG
2. How to Change Photo / Image Size in Paint for Favicon in Blog
3. How To Share Or Share Blog Links to Social Media (Facebook)

    HOW TO MAKE A LARGE POSTINGAN WHILE TOUCH TO KURSOR

1. Login to Blogger pal.

2. Go to Blog Dashboard, then click Theme / Template. Then click Edit HTML.




3. Then find the code]]> </ b: skin>, then copy and paste the following javascript code right above the code]]> </ b: skin>. (For how to find script code in Edit HTML theme / blog template, my friend can also read on the title link of article above).

.post img {
-webkit-transform: scale (0.8);
-moz-transform: scale (0.8);
-o-transform: scale (0.8);
-webkit-transition-duration: 0.5s;
-moz-transition-duration: 0.5s;
-o-transition-duration: 0.5s;
opacity: 0.7;
margin: 0 2px 2px 0;
}
.post img: hover {
-webkit-transform: scale (1.1);
-moz-transform: scale (1.1);
-o-transform: scale (1.1);
opacity: 1;
}

4. If already dipastekan script code in Edit HTML, my friend can see the changes that occur in the blog template by clicking "Prieview theme / Template". If my friend has been steady with the theme changes / Template blog, my friend can just click Save theme to save.

Done, that's how to make the image post enlarged when touched the mouse cursor. Hopefully useful, Good luck good luck.
Best regards Blogger.

Share this


0 Comments