Form liên hệ nổi ẩn hiện cho Blogger/Blogspot

Nếu bạn không muốn tạo ra trang tĩnh để chèn hình thức liên lạc cho Blogger, hoặc cũng không muốn đặt nó ở bên phải. Vì vậy, thủ thuật này có thể là sự lựa chọn hoàn hảo của bạn, tạo ra một hộp nổi lên, ẩn xuống của hình thức liên lạc. Video demo Vậy làm thế nào để tạo ra nó?

Floating Contact Form for Blogger
HÀNH HƯƠNG - Nếu bạn không muốn tạo ra trang tĩnh để chèn hình thức liên lạc cho Blogger, hoặc cũng không muốn đặt nó ở bên phải. Vì vậy, thủ thuật này có thể là sự lựa chọn hoàn hảo của bạn, tạo ra một hộp nổi lên, ẩn xuống của hình thức liên lạc. Video demo Vậy làm thế nào để tạo ra nó?
Thêm CSS và JavaScript

Hãy dán mã dưới đây trước ]]></b:skin> trong mẫu của bạn:
.ContactForm, .ContactForm .title {
 display: none;
}
.floating-ct {
 position: fixed;
 width: 250px;
 right: 0;
 bottom: 0;
 z-index: 999;
}
.floating-ct-head a {
 padding: 5px 10px;
 background: #09f;
 color: white;
 font-weight: bold;
 display: inline-block;
 *display: block;
 zoom: 1;
}
.floating-ct-body {
 height: 285px;
 background: white;
 border: 1px solid #09f;
 padding: 10px;
 display: none;
}
.floating-ct-head {
 text-align: right;
}
.floating-ct-body .ContactForm {
 margin: 0;
 display: block!important;
}

Sau đó dán mã dưới đây trước </body> trong mẫu của bạn:
<script type='text/javascript'>
//<![CDATA[
/*Floating Contact Form by BloggerItems.com*/
$('body').append('<div class="floating-ct"><div class="floating-ct-head"><a href="#no-move">Contact</a></div><div class="floating-ct-body"></div></div>');
$('.ContactForm').appendTo('.floating-ct-body');
var slide_up_ct = false;
$('.floating-ct-head a').click(function(){
 if (!slide_up_ct) {
 slide_up_ct = true;
 $('.floating-ct-body').slideDown();
 } else {
 slide_up_ct = false;
 $('.floating-ct-body').slideUp();
 }
});
//]]>
</script>
Lưu lại và thưởng thức thành quả của bạn!

P/s: Chú ý nếu trong mẫu blog của bạn chưa có jQuery thì hãy thêm mã dưới đây vào trước </head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
Chúc bạn thành công!

Theo: bloggeritems

COMMENTS

Booking.com
Name

Ảnh - Video,12,Ảnh tôi chụp,2,Blog,7,Blogger,11,Blogger tips,9,Cảm nhận,1,Cộng đồng,8,Công nghệ,2,Du lịch,21,Facebook,3,Hot,4,ICT,17,Phần mềm,12,Photo,4,Quốc tế,4,Tài liệu,5,Template,1,Video,8,Việt Nam,10,
ltr
item
Vịnh Travel: Form liên hệ nổi ẩn hiện cho Blogger/Blogspot
Form liên hệ nổi ẩn hiện cho Blogger/Blogspot
Nếu bạn không muốn tạo ra trang tĩnh để chèn hình thức liên lạc cho Blogger, hoặc cũng không muốn đặt nó ở bên phải. Vì vậy, thủ thuật này có thể là sự lựa chọn hoàn hảo của bạn, tạo ra một hộp nổi lên, ẩn xuống của hình thức liên lạc. Video demo Vậy làm thế nào để tạo ra nó?
http://4.bp.blogspot.com/-I0nSTxkOL5w/UcE43O96QlI/AAAAAAAAFCc/y7gXwwZ8H_A/s400/contact.gif
http://4.bp.blogspot.com/-I0nSTxkOL5w/UcE43O96QlI/AAAAAAAAFCc/y7gXwwZ8H_A/s72-c/contact.gif
Vịnh Travel
http://www.vinhtravel.com/2014/09/form-lien-he-noi-hien-cho-blogger.html
http://www.vinhtravel.com/
http://www.vinhtravel.com/
http://www.vinhtravel.com/2014/09/form-lien-he-noi-hien-cho-blogger.html
true
7800426333090035644
UTF-8
Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS CONTENT IS PREMIUM Xin hãy like hoặc chia sẻ lên twitter để xem nội dung bài viết Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy