Demo
Demo link : http://trandangduat.forumvi.com/t7-topic
Hoặc : https://jsfiddle.net/53abskm1/
Nhấn vào nut đóng là nó fade luôn á !
Cách làm
- Làm chi tiết:
Vào CSS thêm :
- Code:
/*Quangcao - made by trandangduat*/
.cbc{background-position:right top;background-repeat:no-repeat;cursor:pointer;height:15px;right:0;top:0;margin:0;overflow:hidden;position:absolute;transform:scaleX(1);width:16px;z-index:9010;color:white;background:red;font-size:16px;padding:4px;text-align:center;border-radius:0 0 0 5px;font-weight:bold;transition:.2s}
.cbc:hover{background:rgba(255,0,0,0.93)}
Quăng code này vào overall_footer_begin
- Code:
<script type="text/javascript">
$(document).ready(function () {
$("#cbc").click(function () {
$(this).parent().fadeOut(500);
});
});
</script>
<div style="box-shadow: 2px 2px 7px #888888;position: fixed;bottom: 150px;z-index: 9999;left: 2px;border: 4px solid #fff;border-radius: 4px 1px 1px 4px;">
<div id="cbc" class="cbc">
<div id="cb-x" class="cb-x">x
</div>
</div>
<a href="https://www.tinhoc123.net" target="_blank" class="tooltipstered"><img width="125" height="300" src="http://i.imgur.com/meJHddD.jpg"></a>
</div>
- Code gộp:
Quăng vào overall_footer_begin
- Code:
<script type="text/javascript">
$(document).ready(function(){
$("#cbc").click(function(){
$(this).parent().fadeOut(500);
});
});
</script>
<div style="box-shadow: 2px 2px 7px #888888;position: fixed;bottom: 150px;z-index: 9999;left: 2px;border: 4px solid #fff;border-radius: 4px 1px 1px 4px;"><div id="cbc" class="cbc"><div id="cb-x" class="cb-x">x</div></div><a href="https://www.tinhoc123.net" target="_blank" class="tooltipstered"><img width="125" height="300" src="http://i.imgur.com/meJHddD.jpg"></a></div>
<style>.cbc {background-position: right top;background-repeat: no-repeat;cursor: pointer;height: 15px;right: 0;top: 0;margin: 0;overflow: hidden;position: absolute;transform: scaleX(1);width: 16px;z-index: 9010;color: white;background: red;font-size: 16px;padding: 4px;text-align: center;border-radius: 0px 0px 0px 5px;font-weight: bold;transition: .2s;}.cbc:hover {background: rgba(255, 0, 0, 0.93);}</style>
Thiết lập
Thay "https://i.imgur.com/meJHddD.jpg" thành link ảnh với size là : 125 x 300
Thay : "https://www.tinhoc123.net" thành link ảnh sẽ dẫn đến