关于jquery：如何在ColorBox弹出窗口中显示标题和标题(来自图像’alt’属性的标题和来自’title’属性的标题

How do I display, in a ColorBox popup, a caption AND a title (caption from image ‘alt’ attribute and title from ‘title’ attribute

我试图在 ColorBox 弹出窗口中显示一个标题和一个标题(来自图像 //’alt//’ 属性的标题和来自图像 //’title//’ 属性的标题)。
单击图像时会打开颜色框。

这是我想做的一个例子。

screenshot

img 将如下所示。

1	<img typeof="foaf:Image" src="http://localhost:4444/img.jpg" width="336" height="254" alt="LEGEND / CAPTION balbalblalblalba balbalblalblalba balbalblalblalba" title="TITLE balbalblalblalba balbalblalblalba balbalblalblalba" class="">

你知道我该怎么做吗？

您可以使用一个 div 来设置图像的背景

1
2
3
4
5

div
{
height: 616px;
background:url(http://i.stack.imgur.com/eXA9b.jpg)
}

然后使用 :before 和 :after 选择器将文本添加到所需位置

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

div::before {
content:"Title"
position: relative;
top: 100px;
background-color: white;
opacity: 0.5;
}

div::after {
content:"Caption";
position: relative;
top: 400px;
background-color: white;
opacity: 0.5;
}

更改顶部以获得所需的文本位置和不透明度以获得所需的不透明度

这里有完整的小提琴 http://jsfiddle.net/rsm07fdw/

原创文章，作者：ItWorker，如若转载，请注明出处：https://blog.ytso.com/268771.html