无缝框架/ IFRAME(带有合理的滚动条)?

时间:2009-11-05 21:35:38

标签: html

摘要:

我想在我的页面中显示固定内容下的其他域名的购物车 - 并让滚动条正常显示。

详细信息:

我需要在“我的”网站的页面中显示来自供应商的购物车,并在顶部显示“我的”标题。 (最终购物将全部在子域中,但现在不是,叹息。)标题是固定的高度。当您在该框架内导航时,购物车页面的高度会有所不同。

我尝试过框架和iframe,并且与iframe有跨浏览器问题。我只测试四种配置,Windows / IE,Windows / Firefox,Mac / Safari和Mac / Firefox。

现在我正在使用一个有两个框架的框架集,一个框架包含我的固定高度标题页面,另一个框架包含外部页面。这确实有效 - 一个问题是当滚动条出现时(当然)它只出现在底部框架上。

这样做,客户端不是很复杂,但它会错误 me

如果我使用IFRAMES,我发现我需要在不同的地方洒高度:100%和溢出-y:auto - 然而我仍然无法避免出现在至少一个浏览器中的两个不可接受的问题之一/操作系统组合......

  1. 组合内容大于窗口,但不显示滚动条。
  2. 内部滚动条和外部滚动条都会出现。
  3. 任何提示都赞赏!

    编辑:

    感谢您的工作 - 但我认为我没有正确地传达这个问题。

    我没有使用框架进行布局 - 我希望只是在另一个网站上构建一个页面框架(托管购物车并且不应公开其URL)。

    框架“工作” - 但在第二帧上有一个内部滚动条,整个页面上没有滚动条肯定是错误的行为。我的客户不会知道这一点,但对于看到该页面的人来说,它看起来很业余。

    我没有看到服务器端包含或CSS如何做到这一点,我相当清楚。如果我使用服务器端包含,那么购物车内部的链接如何工作?我会离开我的网站,对吗?

    摘要:托管在其他网站上的购物车,嵌入在我的内容网页上。

1 个答案:

答案 0 :(得分:1)

不要使用框架,如果用户执行命令+单击,则产品将在新窗口中打开,框架将消失。

我在这里看到的一个可行的解决方案是使用Javascript:

  1. 通过$ .ajax
  2. 加载页面
  3. 重定向所有点击,以便通过

    在ajax窗口中加载
    $('iframe a').on('click',function(){
    
        // load the product via AJAX
    
    });
    
    1. 确保Div的高度不固定,以便它自动扩展,滚动条仅在窗口上。
  4. 这是我可以想到在隐藏网址时保持集成无缝的最佳方式