问题标签 [jquery-backstretch]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
5 回答
3832 浏览

jquery - 动态更改 jQuery 图像 src

我看到只是想知道如何每隔 5 秒就更改一个 src,

我在用

是否可以像幻灯片一样将“home5.jpg”与其他图像(比如 home6.jpg 和 home7.jpg)交换?我不确定如何动态更改它

0 投票
1 回答
1047 浏览

jquery - 用于网格图像的 jQuery Backstretch?

我正在尝试创建一个可作为插件“Backstretch”扩展的图像网格。您可以将插件用于包含他所有图像的多个 div 吗?

0 投票
1 回答
875 浏览

jquery - jQuery Appends 没有出现在 IE9 中

我正在修改一个名为 backstretch 的背景图像拉伸脚本(在此处找到)以将 HTML5 视频拉伸为浏览器中的全屏背景。

我在 Chrome、Safari 和 FireFox 中使用以下代码,但是,在 IE9 中(惊喜,惊喜)它没有将这些附加附加到不同来源的视频元素。

这是整个脚本的全部内容。非常感谢任何想法或帮助!提前致谢!

0 投票
1 回答
1403 浏览

jquery - 带有FF / IE的jquery backstretch背景图像

我有一个简单的页面结构,其中一个大图像作为“正在进行的工作”页面的背景。

问题是在 Firefox 的 1152x864 分辨率下,背景图像被“截断”,而在 Internet Explorer(和相同的分辨率)下,一切似乎都正常。

“截断”的意思是徽标,特别是“创意摄影师”一词,似乎非常靠近显示器的左侧。

对于其他屏幕分辨率(1200x800、800x600),图像对我来说也很好!

该网站是公开的,网址为http://www.antoniafiore.com

我有什么不对吗?你能建议我哪里错了吗?

感谢您的回复!

这里有一些截图

0 投票
1 回答
1217 浏览

javascript - 更改后伸元素内的图像

目前我正在尝试实现用我的后伸改变图像的能力。Backstretch 像这样绑定到块级元素,

然后我想要做的是能够点击一个链接获取href并添加一个新的回溯图像但是现在发生的是一个新的回溯实例被创建,这是我的点击代码,

我哪里错了?我想要做的就是更改#background-image.slideshow 中的后拉伸图像

0 投票
1 回答
1084 浏览

jquery - 使用 jQuery 将图像不透明度添加到背景图像

我指的是位于http://www.gamezilla.co.za的朋友网站。

背景图像使用 jQuery 插件 (backstretch) 拉伸,但图像上有一个非常轻的网格遮罩。如何使用 CSS 或 jQuery 将此蒙版添加到背景图像?

背景图像上没有遮罩,如此处所示 (http://www.gamezilla.co.za/wp-content/uploads/2012/09/b_homepage.jpg)

知道它是如何工作的吗?

0 投票
0 回答
426 浏览

javascript - 动画一个带有后伸的 div

我正在尝试使用一个设置为初始浏览器窗口 100% 的 div,并应用 Backstretch 插件,并让它在单击时设置动画以调整到更小的尺寸,而它下面的另一个 div 调整为好吧,允许他们共享屏幕。所有功能似乎都可以正常工作,接受 div 将调整大小并且最初会随之进行回弹,但在动画功能结束后,回弹将迅速回到 100% 的窗口。更奇怪的是,当用户调整整个浏览器的大小时,后伸会卡到正确的位置,并保持在那里。

我将它放入jsfiddle中,问题的工作方式与我在代码中的工作方式完全相同。click 函数会调整 div 的大小,并且 backstretch 会从其中弹出,直到浏览器调整大小。通常我喜欢尝试解决这种问题,但是我认为这可能超出了我的想象,而且我的最后期限即将到来,这个问题已经困扰了我 2 周。任何见解都会非常有帮助。

这是我正在使用的代码:

HTML

CSS

JS

​</p>

0 投票
2 回答
1681 浏览

html - 父母身高比孩子小,为什么?

我正在尝试在我的网站的父容器(不是全身)中垂直拉伸图像,它是 id 为“imagen-fondo”的 div

我已经尝试过 backstretch 插件,也尝试过带有 background-size 的 css background-image 来做到这一点。

但是这两种情况的问题是父容器的计算高度小于直接子容器的高度,因此,背景图像看起来比内容本身要小。

我怎样才能让它和他的直系孩子一样高,或者至少更大?

你可以在这里看到现场演示:

屏幕截图显示了父 div 的高度

屏幕截图显示了子 div 的高度

更新:

我认为问题在于 div#imagen-fondo 正在获取窗口的高度而不是他的内容的高度,这就是当屏幕很大时问题不会发生的原因,但是当窗口的高度是比它发生的内容要小,你可以用这两个截图来检查它,就像你开始垂直滚动背景图像一样:

第1步,滚动到顶部 step2、滚动一点显示背景结束

有溢出的东西?

更新 2:

现在我介绍了一些 javascript 来使它工作,

获取页脚偏移位置并将“.backstretch” div 的高度拉伸到该高度。

但是,如果您调整窗口大小以使垂直滚动条出现并检查页面,您仍然可以看到父容器“#imagen-fondo”(backstretch 应该自动获取他的高度)仍在获取高度可见视口,而不是来自内容本身。

如果有人找到更好的方法来做到这一点,CSS 只会使用这种方法而不是这种肮脏的方法。

0 投票
1 回答
1068 浏览

wordpress - 如何在 $.ajax 函数中使用 backstretch 插件方法

我正在开发一个响应式 Wordpress 主题的 Instagram 画廊,并发现了一些我需要帮助的问题。

我正在使用 ajax 和 jsonp 获取 Instagram 提要,并将结果附加到几个空 div 中。我正在使用的简化代码是:

此脚本将每张 Instagram 图片分配给特定的 div(“id=instabox1”、“id=instabox2”等)。这段代码运行良好。

现在我想使用 jQuery Backstretch 插件使图片具有响应性。为了使它工作,我只需要使用代码:

这行代码工作正常,以便 backstretch.js 正确加载并正常工作。

所以这是我遇到的问题。我想从 Instagram 获取最新照片,并通过将它们动态分配给 backstretch 插件来使它们具有响应性。我尝试的第一件事是在成功部分中调用 ajax 函数中的 backstretch 方法:

鉴于 data.data[i].images.low_resolution.url 给出了图像的正确路径,我认为这会将 backstretch 方法应用于 boxitem (#instabox0, #instabox1, ...) 定义的 id,以便div 将按顺序填充。

那是不起作用的部分,给出错误: Uncaught TypeError: Object [object Object] has no method 'backstretch'

因此,如果我在 $.ajax 函数之外使用 .backstretch 方法,它可以正常工作(但是我没有得到 Instagram 图片的动态路径)。

如果我在 $.ajax 函数中使用 .backstretch 方法,它会给出提到的错误。

我已经尝试了很多事情,比如动态地将后伸图像的代码行编写为字符串,将它们存储在数组中并在 ajax 函数之外,对其进行评估:

但我总是收到“没有方法'backstretch'”错误消息。

我还创建了一个脚本部分,并使用适当的后伸动态生成的代码填充它,例如:

但是当页面加载时它不会执行。

有什么帮助吗?如何在 Ajax jsonp 函数中使用 .backstretch 方法?如果我使用不同的方法来获取 Instagram 照片会更容易吗?我可以创建脚本部分,但是,当页面已经加载时,如何执行它?

非常感谢,我不是专业的程序员,所以我有点卡在这个问题上。我可能忽略了一些对你们来说显而易见的事情,但我已经尝试解决它好几天了。

任何帮助将不胜感激。

0 投票
0 回答
273 浏览

jquery - jquery在FF中加载时回弹白色背景

我正在为一个站点做一个演示,当我在 FF (mac) 中加载或刷新页面时,看起来左列的背景占据了整个页面,直到你调整浏览器大小或滚动鼠标。

Chrome(mac)中似乎没有发生。不太确定它是在我的 CSS 中还是在 FF 中。此外,当我不使用图库作为背景图像时,似乎不会发生。

这是我的演示的链接:

http://review.boostmktg.com/niven/

非常感谢任何见解。谢谢!