1

在这里，我的代码在 IE10 中运行良好，但滚动条出现在 chrome 和 Firefox 中。只有当 iframe 的边框单击它时，它才会导航到链接。此外，iframe 不可点击。帮帮我....

    <style>
.icon-remove-sign {
       position: absolute;
       top: 0;
       right: 0;
</style>


$(document).ready(function(){ 
$('i.icon-remove-sign').on('click',function(e){
    e.preventDefault();
    pdfID = $(this).closest('.imagewrap')[0].id;
    $('#dialog').dialog('open');
  alert('Deleting '+pdfID+'');
   $(this).closest('.imagewrap')
        .fadeTo(300,0,function(){
            $(this)
                .animate({width:0},200,function(){
                    $(this)
                        .remove();
                });
        });   
});
});



<div class="imagewrap">
    <iframe src="http://team358.org/files/website/Basic_HTML_Tutorial.pdf#scrollbar=0&scrolling=0" width="150" height="100" scrolling="no"></iframe>
    <a href="http://team358.org/files/website/Basic_HTML_Tutorial.pdf">&nbsp;</a><i class=" icon-remove-sign"></i>
</div>
4

3 回答 3

1

滚动条属于 PDF 插件，不属于<iframe>. 因此，据我所知，您无法使用 HTML 或 CSS 控制其外观。这也是为什么该链接仅在您单击边框时才有效的原因：边框仍然属于 HTML 页面，但 PDF 插件不会将它收到的点击委托给浏览器（我无法想象它是怎么做到的！ )

另外，在标签<iframe>里面放一个？<a>我以前从未见过，我不确定你为什么要这样做。

也许您想将 iframe 设置为链接的目标，像这样？

<iframe width="100%" height="100%" name="pdf_frame"></iframe>
<a href="http://team358.org/files/website/Basic_HTML_Tutorial.pdf"
  target="pdf_frame">HTML Tutorial</a>

http://jsfiddle.net/p75wM/2/

编辑：既然我理解了你的问题，我想你会在这里找到很好的信息：（还可以查看该帖子的更新）

于 2013-07-26T09:16:19.313 回答
0

使用带有样式的容器 div

<style>
    #container{width: 500px; height: 300px; overflow: hidden;}
          iframe{width: 518px; height: 318px;}
    </style>
    <body style="margin:0px; padding:0px; overflow:hidden;">
    <div id="container">
    <a href="http://team358.org/files/website/Basic_HTML_Tutorial.pdf">
          <iframe src="http://team358.org/files/website/Basic_HTML_Tutorial.pdf" frameborder="0" scrolling="no" > 

    </iframe></a>

    </div>
于 2013-07-26T10:24:32.053 回答
0 
<style>
    .iframe_thumb {
        position : relative;
        overflow : hidden;
    }
    .iframe_thumb a {
        position : absolute;
        top : 0;
        left : 0;
        width : 100%;
        height : 100%;
        z-index : 10;
    }
    .iframe_thumb .delete {
           postion : absolute;
           top : 5px;
           right: 0;
           z-index : 11;
    }
</style>

<div class="iframe_thumb">
    <iframe src="http://team358.org/files/website/Basic_HTML_Tutorial.pdf#scrollbar=0&scrolling=0" width="100" height="100" scrolling="no"></iframe>
    <a href="http://team358.org/files/website/Basic_HTML_Tutorial.pdf">&nbsp;</a>
    <a href="url/to/delete" class="delete"><img src="images/delete.png" /></a>
</div>
于 2013-07-26T09:12:51.953 回答