JQuery+CSS实现图片上放置按钮的方法

页面导航:首页 > 网络编程 > JavaScript > JQuery+CSS实现图片上放置按钮的方法

JQuery+CSS实现图片上放置按钮的方法

来源:互联网 作者:脚本宝典 时间:2015-06-01 13:43 【

这篇文章主要介绍了JQuery+CSS实现图片上放置按钮的方法,涉及jQuery鼠标事件及页面样式的相关技巧,需要的朋友可以参考下

本文实例讲述了JQuery+CSS实现图片上放置按钮的方法。分享给大家供大家参考。具体分析如下:

position:relative日常应用的时候一般是设置给position:absolute;的父层的,
父层position:relative; 子层position:absolute;的话, 就是依照父层的边界进行定位的, 
不然position:absolute 会逐层向上寻找设置了position:relative的元素边界, 直到body元素..

第一种写法(连同CSS一起追加进去)

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
var freeOne="";
freeOne=$(".freePreviewOne").attr("data-url");
if(freeOne==null){
 //没有免费视频
}else{
 $("#coursePicture").append("<a class='hide-650 fade5' "+
  "style='top:94px;left:150px;position:absolute;z-index:100; " +
  " width: 180px;height: 60px;border: 2px solid white;" +
  "display: block;color: white;text-decoration: none;" +
  "letter-spacing: 1px;font-size: 16px;line-height: 20px;" +
  "text-align:center;padding-top:18px;" +
  "background-color: rgba(0, 0, 0, 0.44);" +
  "-webkit-backface-visibility: hidden;-webkit-transition: all .3s ease-in-out;" +