我正在尝试做这件事:
$("a[rel=popover]").popover({
html: true,
trigger: 'hover',
content: '<img src="'+$(this).data('img')+'" />'
});
但是它不起作用,因为$(this).data('img')无法正常工作。
我之所以这样做,是因为在data-content属性中使用模板和HTML会产生冲突。所以我把图像源放在一个data-img属性中,并希望获取它并将其放入img元素中。
我尝试过这样做,但并没有完全成功:
$("a[rel=popover_img]").popover({
html: true,
trigger: 'hover',
content: '<img src="#" id="popover_img" />'
}).hover(function(){
$('#popover_img').attr('src',$(this).data('img'));
});
我希望有人可以帮助我 :)
.popover { max-width: 276px; }
。但是,它还有img { width: 100%; }
,应该相应地缩放弹出内容。你描述的问题一定来自于冲突的CSS或自定义样式。 - mervwidth: 100%
表示图像的宽度应缩放以适应其父容器。因此,不,它不应该更大;它正在按设计进行操作。 - merv$('a[rel=image-popover]').popover({ html: true, trigger: 'hover', placement: 'top', content: function(){return '
';}
}).on("show.bs.popover", function() {
return $(this).data("bs.popover").tip().css({
height: "280px"
});
});
- Abram