Chèn hiệu ứng cuốn góc bằng jQuery cho blogger ~ Tin Học

Chèn hiệu ứng cuốn góc bằng jQuery cho blogger với vài thao tác rất đơn giản

Bước 1 : Vào Blogger.com >> Template >> Edit HTML sau đó tìm đoạn chữ sau : ]]></b:skin> , sau đó chèn đoạn css sau bên trên đoạn chữ vừa tìm được :

/*=======================================================

   MBL Page Peel PRO Effect For Blogger

  =======================================================*/

.admin-bar #PagePeel{top:27px;}

/*Extra 20px height and width to allow for shadow and movement*/

#PagePeel{

    height:120px;

    overflow:hidden;

    position:absolute;

    right:0;

    top:0;

    width:120px;

    z-index:9999;

}

#PagePeel svg{

    overflow: hidden;

    position: absolute !important;

    right: 0;

    top: 0;

}

#PagePeel .pointCursor:hover{cursor:pointer;}

#mycontent { position:relative; margin-left:30px; }

Bước 2 : Sau khi chèn xong, các bạn tiếp tục tìm kiếm thẻ </head> rồi copy đoạn javascript sau

và past ngay trên thẻ này :

<!--MBL Page Peel PRO Effect For Blogger-->

<script type="text/javascript" src="https://googledrive.com/host/0B0WJjcJEFNziazIzXzlhMlhtWlU"></script><script type="text/javascript" src="https://googledrive.com/host/0B0WJjcJEFNziMmk4anpFWnRPWHc"></script>

<script type="text/javascript" src="https://googledrive.com/host/0B0WJjcJEFNzidExmT1JpWV9xNmc"></script></pre>

<div id="mycontent">Peel Away Effect By <a href="http://www.thuthuatweb.net">thuthuatweb.net</a></div>

<pre>

<script type="text/javascript">// <![CDATA[

var PagePeelProParams = {"smallImageUrl":"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjL0j0eYM6ZlELMTeaaktaiTwd21_-GAtUbnONjr4NUcpWEnTJUqm9E8HFAtUSDs11_6gYQRwBjzACIcasplZYRGDvQnnCCfNQMCGKOOIpkpDdYRr9mJEayjSZprVz5XphndghcflcQy60/s1600/DottedAdvertSmall.png", "largeImageUrl":"link-hinh","peelColorStart":"#545454","peelColorEnd":"#cdcdcf","pagePeelTargetUrl":"http://www.your-ad-url.com","pagePeelActivateEvent":"hover"};

// ]]></script>

Trong đoạn javascript trên , có 2 đường dẫn bạn cần phải thay thế :

– Một là : link-hinh – Các bạn nên thay thế bằng hình ảnh của các bạn , nhớ là kích thước nên đặt là 500 x 500 px.

– Hai là : http://www.your-ad-url.com : Thay bằng link mà bạn muốn trở tới khi click vào banner.

Sau khi thay xong, các bạn lưu lại và kiểm tra kết quả là xong.