如何避免JQuery弹出窗口覆盖整个屏幕宽度?
我正在尝试使用插件插入JQuery弹出窗口。虽然,它的工作很好,但只要弹出窗口显示出来,它就会覆盖整个屏幕宽度。高度可以,但宽度可以覆盖整个屏幕。 我尝试使用插件文档中给出的width属性,但同样的方法不起作用,而属性的其余部分按预期工作 下面是示例代码如何避免JQuery弹出窗口覆盖整个屏幕宽度?,jquery,popupwindow,Jquery,Popupwindow,我正在尝试使用插件插入JQuery弹出窗口。虽然,它的工作很好,但只要弹出窗口显示出来,它就会覆盖整个屏幕宽度。高度可以,但宽度可以覆盖整个屏幕。 我尝试使用插件文档中给出的width属性,但同样的方法不起作用,而属性的其余部分按预期工作 下面是示例代码 function shw(){ $.confirm({ boxWidth: '30%', animation: 'Rotate', title: 'Prompt!'
function shw(){
$.confirm({
boxWidth: '30%',
animation: 'Rotate',
title: 'Prompt!',
content: '' +
'<form action="" class="formName">' +
'<div class="form-group">' +
'<label>Enter something here</label>' +
'<input type="text" placeholder="Your name" class="name form-control" required />' +
'</div>' +
'</form>',
buttons: {
formSubmit: {
text: 'Submit',
btnClass: 'btn-blue',
action: function () {
var name = this.$content.find('.name').val();
if(!name){
$.alert('provide a valid name');
return false;
}
$.alert('Your name is ' + name);
}
},
cancel: function () {
//close
},
},
onContentReady: function () {
// bind to events
var jc = this;
this.$content.find('form').on('submit', function (e) {
// if the user submits the form by pressing enter in the field.
e.preventDefault();
jc.$$formSubmit.trigger('click'); // reference the button and click it
});
}
});
}
函数shw(){
美元。确认({
箱宽:“30%”,
动画:“旋转”,
标题:“提示!”,
内容:“”+
'' +
'' +
“在此处输入内容”+
'' +
'' +
'',
按钮:{
表格提交:{
文本:“提交”,
btn类:“btn蓝色”,
行动:功能(){
var name=this.$content.find('.name').val();
如果(!name){
$.alert('提供有效名称');
返回false;
}
$.alert('您的名字是'+名字);
}
},
取消:函数(){
//接近
},
},
onContentry:函数(){
//绑定到事件
var jc=这个;
此.$content.find('form')。关于('submit',函数(e){
//如果用户通过在字段中按enter键提交表单。
e、 预防默认值();
jc.$$formSubmit.trigger('click');//引用按钮并单击它
});
}
});
}
这里,对按钮单击事件调用方法shw() 根据
jquery confirm
插件()的文档,要设置customWidth
选项,您还必须设置useBootstrap:false
请编辑您的问题以包含您的代码。请参阅。编辑问题并添加代码。根据插件文档,属性“boxwidth”用于设置弹出框的大小。在这里它不起作用。是的,它需要任何浏览器更改或类似的更改吗?文档中说“useBootstrap必须设置为false才能使用此功能”(boxWidth
)-您这样做了吗?我添加了这个作为答案。