javascript - iframe 上的 Jquery 自定义滚动条

标签 javascript jquery html jquery-plugins scrollbar

我正在寻找一个可靠的跨浏览器 Jquery 自定义滚动条插件,它可以很好地与 iframe 配合使用。谁有好的插件和解决方案?

最佳答案

很大程度上取决于上下文:

  • 您想创建一个带有样式滚动条的 iframe,其他人可以将其放置在他们的网站上吗?
  • 或者您是否正在尝试为通过 iframe 放置在您网站上的其他人的内容设置样式?

如果您可以控制 iframe 的内容,那么这很容易做到。 我用过 http://livepipe.net/成功。

自定义滚动条的工作原理通常是将内容放在 a 中,然后通过 javascript 将该元素相对于父 div 移动。

编辑 1:

这是详情页。只需开始编辑值。 http://livepipe.net/control/scrollbar

当您在 iframe 中而不是加载页面时,您会知道自己做对了,无论高度如何,精美的滚动条都是浏览器视口(viewport)高度的 100%。

可能还值得添加一个函数来重新计算对象的高度和底部控件在窗口调整大小时的位置。虽然,使用 jQuery 比使用 PrototypeJS 更容易做到这一点。

编辑 2: 这是我编写的一个工作示例: http://pastebin.com/gvtnLANQ

关于javascript - iframe 上的 Jquery 自定义滚动条,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6688768/

相关文章:

php - 从 for 循环创建 PHP 下拉菜单?

html - Firefox 输入类型时间文本对齐 : center

javascript - 使用 Ajax 加载页面并将数据发送到页面

javascript - 获取反向引用值并修改这些值

php - 我有一个 HTML 表单用于更新数据库中的内容,如果我在表单的输入字段中输入单引号,则 sql 更新失败

javascript - 不使用 JQuery 隐藏 DOM 中选定的元素

php - 为什么表单不阻止提交?

javascript - highchart 将 x 轴标签放置在日期时间轴上的刻度之间

javascript - AngularJS 对动态生成的输入指令的表单验证不适用于 ngForm

javascript - 这个 JavaScript 是如何工作的?