- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在开发 bx slider jquery 插件。有时视口(viewport)高度设置不正确。当 slider 第一次加载时会发生这种情况。如果我在正确设置视口(viewport)后单击下一个或上一个按钮。我还 checkin 了 bxSlider.js,它也会返回错误的值。这表明只有一个子项(图像),但我使用 5 张图像。我将宽度设置为 250 px,但它返回 953px..我使用了以下插件。
https://cdnjs.cloudflare.com/ajax/libs/bxslider/4.2.5/jquery.bxslider.min.css http://bxslider.com/js/jquery.min.js https://cdnjs.cloudflare.com/ajax/libs/bxslider/4.2.5/jquery.bxslider.js https://cdnjs.cloudflare.com/ajax/libs/bxslider/4.2.5/vendor/jquery.fitvids.js https://cdnjs.cloudflare.com/ajax/libs/bxslider/4.2.5/vendor/jquery.easing.1.3.js
最佳答案
如果页面加载方式发生变化,例如添加额外的插件,bxSlider 将无法完成其计算,并且在重新绘制之前不会完成计算。通常通过使 bxSlider 移动下一个或上一个来完成。我通过强制 bxSlider 在加载时重新计算来修复此行为。这里有两个建议,第一个是被动的和最小的,第二个是激进的和过度的。我建议单独尝试第一个,如果不起作用,请一起使用它们。
修复#1。将以下规则集添加到样式表底部或 <style>
的最后一行 block :
.bx-viewport.bx-viewport { min-height: 90vh !important; }
在类选择器上加倍可能看起来很奇怪,但它会增加选择器的选择性,!important
和双选择器一样是可选的。这是修复#1的要点:
.bx-viewport { min-height: 90vh; }
修复#2。将此 JS 放在结束符之前 </body>
标签:
document.documentElement.addEventListener('DOMContentLoaded', function(event) {
var $tgt = $('.bx-viewport')[0];
var tgt = document.querySelector('.bx-viewport');
tgt.style.height = ""
tgt.removeAttribute('height');
tgt.style.removeProperty('height');
$tgt.css('height', '');
$tgt.removeAttr('height');
}, false);
大多数时候使用修复#1就足够了。 修复 #2 有点过分,但它总是有效。
关于jquery - bxslider jquery 插件中的视口(viewport)高度设置不正确,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38309094/
你能帮我解决这个问题吗?当我按下下一个键(右箭头)时,我试图将箭头控件(左和右)集成到 BxSlider 显示最后一个 slider 图像,它不应该显示,而是显示下一个 slider 图像,然后与前一
我使用以下代码创建 bxslider 我无法将图像超链接到特定链接,即我想将每张幻灯片链接到网址这可能吗?该项目已经达到了我无法将其更改为另一个 jquery 插件的地步
我有一个使用 bxslider 的非常基本的 slider 。 我想在 bxslider 本身内运行另一个画廊。 请看这个 fiddle :http://jsfiddle.net/CHeLE/6/ 当
我正在使用“D5 Socialia”主题版本 1.2.8、WordPress 3.7 并在我的网站上安装了 lumia-bxslider slider 插件。 我遇到了这些问题: - Height w
其中一个应用程序必须使用 bxslider。我在尝试通过 ajax 实现带有动态加载内容的 bxslider 时遇到了一些问题。 它突然起作用了。有趣的是,当通过打开开发工具或更改窗口大小对视口(vi
我刚刚开始使用 bxSlider,但遇到了问题。我想要一个具有固定宽度(所有图像具有相同值)和自适应高度的 slider 。这是一项非常标准的任务,但我被困住了,我不知道该怎么办。现在 bxSlide
我正在使用 bx-slider 并面临一个问题,即 slider 的页面加载图像无法完美加载。我希望图像应该在页面加载时完全加载或在完成页面加载后加载,否则图像将隐藏直到页面未完全加载。这是java脚
不确定是我瞎了还是根本就没有。我想在特定宽度上停止 bxSlider 自动播放?就这么简单 最佳答案 通常,您会像这样启动 bxSlider... $(document).ready(function
如何使第一个bxslider幻灯片向左移动-26px?我在 slider 中找到了这一行: propValue = slider.settings.mode === 'vertical' ? 'tra
我的网页上有一个 bxSlider。当鼠标悬停在自定义分页器上时,我试图停止 slider 。这是我的 html:
我在我的网站上使用 bxSlider。 slider 应在窗口调整大小时重新加载。通过代码,我实际上使用 slider 在加载和调整大小时加载。但 slider 没有重新加载,而是第二次加载。所以我有
我的 中大约有 10-15 张幻灯片。 最大幻灯片数为 4,但仅显示 1 张幻灯片。页面加载时, slider “闪烁”,并显示 4 张幻灯片,但之后又显示一张幻灯片。 slider 出了什么问题?感
我使用这个 slider http://bxslider.com/examples/thumbnail-pager-1 。它有效,但我有很多元素,缩略图不适合一行并移至下一行。如何像轮播一样制作缩略图
我正在使用 bxslider 制作一个简单的轮播,每张幻灯片一张 jpg。因为我有 8 张 jpg,所以每张幻灯片底部显示 8 个项目符号。我有什么方法可以删除或隐藏它们。 最佳答案 bxslider
我目前已经在我正在开发的网站上实现了 bxslider。相关页面上有 3 个 slider ,带有自定义下一个和上一个控件。 我使用类而不是 id 设置了 bxslider。 $('.carousel
我正在使用一个使用 jQuery bxslider 脚本的 WordPress 网站,并尝试在其中一张幻灯片的内容中编写一个 href 链接,单击该链接即可转到下一张幻灯片。 我对 php 以及 bx
我已将 bxSlider 集成到现有应用程序中,显示三张不同的幻灯片。每张幻灯片都包含一个 HTML Canvas ,该 Canvas 会定期更新为新的 JCharts 图表。它工作完美!只是...最
我在我的一个网站中使用 bxslider 作为简单的视频 slider 。但 slider 中的所有视频都会开始加载播放。我必须禁用它。 HTML: result() as $vdo){
我不确定 slider 顶部和底部的额外空白来自哪里。是填充还是边距?如果有人可以帮助我,我将不胜感激。 jsfiddle.net/fH3EL 最佳答案 这是因为 bx-slider CSS 文件造成
我似乎遇到了一个我没有在其他地方看到的问题。 我们在客户网站 (www.laparksfoundation.org) 上有一个 slider 。我们将 slider 设置为 infiniteloop
我是一名优秀的程序员,十分优秀!