2

全部

我想在 iframe 中使用iScroll。

这是我的代码

HTML

<form>
        <input type="text" class="frmUrlVal">
        <input type="submit" class="frmSubmit" value="Go">
      </form>
      <iframe src="http://www.css-tricks.com" width="360" height="500" id="dynFrame"></iframe>

JS

$(function()
{
  $('.frmSubmit').click(function(e)
  {
    $('#dynFrame').attr('src', $('.frmUrlVal').attr('value'));
    e.preventDefault();
  });
});

这是我的 jsfiddle 链接： http: //jsfiddle.net/ajaypatel_aj/JtCJa/ 您可以看到这里有垂直滚动条，我想使用 iSroll 而不是那个常规滚动条。我尝试应用 id，但它对我不起作用。

提前致谢 ！

4

3 回答 3

5

我认为您将拥有的最接近的选项是http://jsfiddle.net/JtCJa/9/它仍然需要调整，您无法单击链接，但它可以按预期工作:)

于 2012-05-14T14:09:24.960 回答
3

您不能从父框架执行此操作。您必须将 iScroll 的脚本直接添加到"http://www.css-tricks.com"页面。如果此站点不属于您，则不能这样做，因为出于安全原因，禁止在来自不同域的页面上执行 JavaScript 代码。

可以设置很大的框架高度，使框架内的滚动条消失，只保留父框架的滚动条。此滚动条可以使用 JavaScript 设置样式，因为它属于您的域。但我认为在框架内使用鼠标滚动页面将不起作用（您无法从第三方框架接收鼠标事件）。并且页面高度变得非常大（您无法确定框架内容的高度）。

好吧，您可以在服务器端下载整个页面内容并在您的站点上显示其副本。在这种情况下，此页面上的 JavaScript 将起作用，并且可以设置滚动条的样式。有几个脚本可以做到这一点。Trey 被称为“网络代理”。您可以使用其中之一，例如PHProxy。自己实现此功能很复杂，因为存在一些技术难题（下载相关文件、重定向 ajax 请求、保存 cookie 等）。

于 2012-05-09T19:53:23.263 回答
3

嘿，ajajy，您还必须在文件中添加类

<iframe src="http://www.css-tricks.com" width="360" height="500" id="navbar" class="navbar_relative"></iframe>

和js函数

function magentoScrollMimic(){
 j(document).scroll(function(e){
      if(j(window).scrollTop()>138)
        {
            j('#dynFrame').addClass('navbar_fixed');
            j('#dynFrame').removeClass('navbar_relative');

        }
        else
        {
            j('#dynFrame').removeClass('navbar_fixed');
            j('#dynFrame').addClass('navbar_relative');
        }
   }); 
}

三焦

并直接使用

<ul id="dynFrame" class="navbar_relative">

我用这个和它的工作

j(document).ready(function(){
    magentoScrollMimic(); }
于 2012-05-10T11:06:27.187 回答