javascript - 如何使我的图片库宽度响应下面的 div?

标签 javascript jquery html css width

我有一个名为 slider1_container 的图片库,它的样式属性在 HTML 代码中指定,例如:

<div id="slider1_container" style="position: relative; top: 0px; left: 0px; width:700px;
    height: 600px; background: #191919; overflow: hidden;">

除了 slider 比下面的 div 框宽之外,这非常有效。这个 div 框是父类“rightcolumn”宽度的 100%,我的 slider1_container div 也在这个类中,但是因为它的宽度 700px 是在 HTML 代码中设置的,所以它没有在其他视口(viewport)尺寸下似乎没有响应。

我尝试在不同点使用媒体查询将 slider1_container 的宽度更改为小于 700 像素的宽度,但 HTML 代码中指定的宽度似乎会否决它。

[死链接已删除,请更新]

如果我将 700px 设置为自动,宽度可以完美工作,但当您加载页面时图片库只显示黑色,直到您选择另一张照片它会很快出现(听起来是 javascript 问题)。

如果您在我的网站上调整视口(viewport)的大小,您会看到图片库的宽度与其下方的 div 框不匹配如何使它像其他 div 一样响应?

谢谢!!

最佳答案

阅读您正在使用的任何幻灯片插件的文档。它很可能具有响应性设置。如果没有,您可以找到一百万种不同的响应式幻灯片插件 here

关于javascript - 如何使我的图片库宽度响应下面的 div?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26478369/

相关文章:

JavaScript:跨浏览器 "browser plugin"检测

javascript - Bootbox,两个模态窗口 - 一个在另一个之上

javascript - xkcd 是如何做 xk3d 的?

javascript - 匹配时带有重音字符的正则表达式

JQuery Select2 - 如何选择所有选项

javascript - 激活特定单词上的悬停操作

javascript - 如何只搜索一个div区域的数据?

html - 垂直拉伸(stretch) DIV

javascript - Bulma:位于页面顶部时导航栏顶部的横幅

javascript - 仅当单击时,才使用下拉菜单中列出的颜色选项填充每个表格单元格的颜色