javascript - 怎么在DIV圖片上加個DIV,并帶有按鈕鏈接呢?
問題描述
怎么在p圖片上加個p,并帶有按鈕鏈接呢?如同所示,哪位大神給個完整代碼謝謝!
問題解答
回答1:給你寫了一個簡單的hover效果http://jsrun.net/TQYKp
html
<p class=’box’> <p class=’image’> <img src=’http://imgsrc.baidu.com/imgad/pic/item/730e0cf3d7ca7bcbd0a1ac09b4096b63f624a83a.jpg’ width=’100%’> </p> <p class=’mask’> <a class=’link’ href=’#’> 查看更多 </a> </p></p>
css
.mask { background: #ff00a5; width: 300px; height: 200px; position: absolute; top: 0; z-index: 99; display: none}.image { width: 300px; height: 200px;}.box { position: relative; width: 300px;}.box:hover .mask { display: block;}.box:hover .link { width: 120px; height: 40px; display: block; background: #FFF; line-height: 40px; text-align: center; margin: 80px auto; color: #ff00a5}回答2:
編程最重要的是思想,代碼自己實現?;舅悸肪褪鞘褂胮osition來解決這個問題。
回答3:加個鼠標移入移除事件,img上放個p移除時透明,
回答4:用display就可以實現啊。。移入移出設置下就好了啊
