隨著這幾年即時(shí)通訊服務(wù)的發(fā)展，微信的影響力也是也來(lái)越大了，現(xiàn)在很多的站長(zhǎng)朋友都會(huì)在自己的網(wǎng)站上添加微信公眾號(hào)，這樣可以實(shí)現(xiàn)和訪問(wèn)者的全方位溝通和互動(dòng)，那么問(wèn)題來(lái)了，要怎么在php虛擬主機(jī)中去實(shí)現(xiàn)呢？而當(dāng)今非常流行的線上線下互動(dòng)營(yíng)銷(xiāo)模式。而這種互動(dòng)營(yíng)銷(xiāo)的模式應(yīng)用在zblog博客上更是非常適用。在zblog程序的網(wǎng)站上添加微信公眾號(hào)效果的方式有很多種不同的方法，今天無(wú)憂(yōu)主機(jī)小編來(lái)給大家介紹一種小編個(gè)人認(rèn)為比較簡(jiǎn)便的實(shí)現(xiàn)方法——用純css樣式實(shí)現(xiàn)微信公眾號(hào)效果。 首先來(lái)介紹一下實(shí)現(xiàn)后的效果吧，就是在網(wǎng)站上添加一行“關(guān)注微信公眾號(hào)”的文字，當(dāng)訪問(wèn)者的鼠標(biāo)移動(dòng)到這行文字上后就會(huì)出現(xiàn)微信二維碼的圖片，鼠標(biāo)移開(kāi)后圖片便會(huì)隱藏。 下面小編來(lái)介紹一下實(shí)現(xiàn)的方法。首先在網(wǎng)站的html源碼中添加文字和微信二維碼圖片的代碼：

<div class="weixin"><a href="javascript:;">關(guān)注微信公眾號(hào)</a><img src="http://www.txcstx.cn/gg/zfb.png" /></div>

然后添加css代碼實(shí)現(xiàn)圖片出現(xiàn)和隱藏的效果，代碼如下：

.weixin{ display:block;text-align:center; position:relative;}
.weixin img{ display:none;}
.weixin:hover img{ position:absolute; left:50%; top:0; margin-left:-115px; padding-top:30px; display:block;}

代碼添加完成之后，點(diǎn)擊保存，在網(wǎng)站后臺(tái)重建一下文件就可以了。最后需要提醒一下的是這個(gè)方法不適用于手機(jī)客戶(hù)端，因?yàn)橐苿?dòng)設(shè)備上是顯示不出鼠標(biāo)的 無(wú)憂(yōu)主機(jī)相關(guān)文章推薦閱讀： ZBLOG關(guān)于安裝多說(shuō)評(píng)論插件的一些問(wèn)題 ZBLOG控制縮略圖大小不變形的方法 ZBLOG添加背景圖片的快捷方法

本文地址：http://m.love62.cn/zblog/21348.html

上一篇: zblog設(shè)置簡(jiǎn)單的圖片跳轉(zhuǎn)廣告的方法
下一篇: Discuz論壇程序如何在帖子版塊內(nèi)添加圖片廣告