如何使JQuery colorbox正确响应

时间:2016-07-11 06:54:12

标签: jquery twitter-bootstrap colorbox

我正在使用colorbox和bootstrap来创建弹出窗体。 我已经指定了百分比的高度和宽度,在小型移动屏幕中加载时,表单非常小且无法使用。 有没有办法让弹出窗口正确响应。

Preview in small screen Preview in desktop

2 个答案:

答案 0 :(得分:0)

使用媒体屏幕并为小于768像素的屏幕设置width:90%或任何您想要的屏幕

答案 1 :(得分:0)

假设你的CSS中有以下内容:

#cboxContent { 
  width: 50%;
  height: 50%;
}

您还需要添加以下内容(使用适合您的界面的任何值):

@media screen and (max-width: 800px) {
  #cboxContent {
    width: 90%;
    height: 90%;
  }
}

(我做了类似的事情,但我没有使用百分比宽度,而是设置边距,并在屏幕较窄时将其值更改为较低的数量。)

和/或您可能希望在min-width上添加min-height#cboxContent