如何使用JavaScript将图像插入alertify.js警报？ [英] How to insert an image into an alertify.js alert with JavaScript?

问题描述

我想创建一个弹出式对话框，其中包含一个大图片和一个确定按钮，对于这个我想自定义 alertify.js 。

I want to create a pop-up dialog with a large image and an OK button and for this I'am trying to customize the alerts of alertify.js .

我的想法是创建一个自定义 css 类的所有这些弹出警报与默认图像url，然后更改url background-image：url（images / level_10.jpg）; 当我使用 JavasScript 创建正确的图像弹出窗口（因为你可以传递自定义 cssClass 调用函数）;​​

My idea was to create a custom css class for all these "popup-alerts" with an default image url, and then change the url background-image: url(images/level_10.jpg); when I create the pop-up to the right image with JavasScript (because you can pass in a custom cssClass when you call the function);

我不知道这是否可能。

也许更好的方式来自定义alertify.js来实现这一点？

Or is there maybe better way to customize alertify.js to achieve this?

推荐答案

您可以覆盖alertify的CSS类。

You can override the CSS class of alertify.

看下面的例子：
http://www.fabien-d.github.io/alertify.js/assets/js/lib/alertify/alertify.bootstrap.css

在你的case，你只是想覆盖 .alertify CSS类这样：

In your case, you just want to override .alertify CSS class like this :

.alertify.popup1 {
    background: url(path/file1.png);
}
.alertify.popup2 {
    background: url(path/file2.png);
}
/* etc */

$("alert1").onclick = function () {
 alertify.alert("This is an alert dialog", function() {}, 'popup1');
};
$("alert2").onclick = function () {
 alertify.alert("This is an other alert dialog", function() {}, 'popup2');
};

检查此小提示是否有工作示例;）

这篇关于如何使用JavaScript将图像插入alertify.js警报？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！