在警报上更改图像大小

时间:2015-08-27 22:17:18

标签: javascript css sweetalert

我正在使用SweetAlert,为了更改图标图像大小,我转到.css文件:

.sweet-alert .sa-icon {
    width: 80px;
    height: 80px;
    border: 4px solid gray;
    -webkit-border-radius: 40px;
    border-radius: 40px;
    border-radius: 50%;
    margin: 20px auto;
    padding: 0;
    position: relative;
    box-sizing: content-box; }

我更改了这些值:

width: 80px;
height: 80px;

但是我看不到变化

如果我删除.sa-icon。并在我的.tpl页面中添加:

<img src="http://placehold.it/350x150" class="sweet-alert">

警报未打开。

我将此代码用于打开警报:

<script type="text/javascript"> sweetAlert({ title: "ADULT CONTENT", text: "ARE YOU OVER 18?", imageUrl: "dist/image.png", showCancelButton: true, cancelButtonText: "No", confirmButtonColor: "#ff0000", confirmButtonText: "Yes, I'am Over 18", closeOnConfirm: true }, function(isConfirm){ if (isConfirm) { } else { window.location.href = 'http://'; } }); </script>

唯一的问题是我的图像大小。我无法改变它。建议?

1 个答案:

答案 0 :(得分:2)

要调整图片大小,您必须使用警报的imageSize属性并将其设置为所需的大小。请注意将heightwidth作为由&#34; x&#34;

分隔的两个值传递

像这样更新您的JS

$(function(){
   sweetAlert({
        title: "ADULT CONTENT",
        text: "ARE YOU OVER 18?",
        imageUrl: "http://placehold.it/350x150",
        imageSize: '180x180', // add your dynamic height and width here
        showCancelButton: true,
        cancelButtonText: "No",
        confirmButtonColor: "#ff0000",
        confirmButtonText: "Yes, I'am Over 18",
        closeOnConfirm: true
    }, function(isConfirm) {
        if (isConfirm) {} else {
            window.location.href = 'http://';
        }
    }); 
});