Magento側邊欄聯繫方式的實現

在這裏插入圖片描述
直接上代碼

<!--Footer Talks-->
<style>
	#talks{width:50px;position:fixed;bottom:150px;right:4px;z-index: 9999;}
	#talks a{float:left;margin-bottom:10px}
	#talks a img{width:40px;}
	#talks a:hover img{transform: scale(1.2);}
	.wechat{position:relative;}
	.erweima{width: 200px;display:none;position:absolute;bottom:0;left:-204px}
	.wechat:hover .erweima {display: block !important;left: -230px;bottom: 16px;}

</style>
<div id="talks">
<a href="mailto:#" target="_blank" title="Talk To Us On Email">
	<img src="<?php echo $this->getUrl('')?>media/talk/email.png" alt="" style="border:0px;" class="bounce">
</a>
<a href="#" target="_blank" title="Talk To Us On Instagram">
	<img src="<?php echo $this->getUrl('')?>media/talk/instagram.png" alt="" style="border:0px;" class="bounce">
</a>
<a href="#" target="_blank" title="talk to us in whatsapp">
	<img src="<?php echo $this->getUrl('')?>media/talk/whatsapp.png" alt="talk to us in whatsapp" style="border:0px;" class="bounce">
</a>
<a href="#" target="_blank" title="Talk To Us On Twitter">
	<img src="<?php echo $this->getUrl('')?>media/talk/twitter.png" alt="Talk To Us On Twitter" style="border:0px;" class="bounce">
</a>
<a href="#" target="_blank" title="Talk To Us On Youtube">
	<img src="<?php echo $this->getUrl('')?>media/talk/youtube.png" alt="Talk To Us On Youtube" style="border:0px;" class="bounce">
</a>
<a target="_blank" title="Talk To Us On Wechat" class="wechat">
	<img src="<?php echo $this->getUrl('')?>media/talk/wechat.png" alt="Talk To Us On Wechat" style="border:0px;" class="bounce">
	<div class="erweima"><img src="<?php echo $this->getUrl('')?>media/talk/#.jpg" style="width:505px !important"></div>
</a>

</div>
<!--Footer Talks-->

很好用,更利於收集客戶

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章