A temida barra de rolagem horizontal do iframe não pode ser removida no IE?

StackOverflow https://stackoverflow.com/questions/67354

  •  09-06-2019
  •  | 
  •  

Pergunta

Eu tenho um iframe.O conteúdo é maior que a largura que estou definindo, então o iframe recebe uma barra de rolagem horizontal.Não consigo aumentar a largura do iframe, então quero apenas remover a barra de rolagem.Tentei definir a propriedade scroll como "não", mas isso mata as duas barras de rolagem e quero a vertical.Tentei definir overflow-x como "oculto" e isso eliminou a barra de rolagem horizontal no ff, mas não no IE.triste por mim.

Foi útil?

Solução 

scrolling="yes"  horizontalscrolling="no" verticalscrolling="yes"

Coloque isso na sua tag iFrame.

Você não precisa se preocupar em tentar formatar isso em CSS.

Outras dicas

A barra de rolagem não é uma propriedade do <iframe>, é uma propriedade da página que ela contém.Tente colocar overflow-x: hidden no <html> elemento da página interna.

Você poderia tentar colocar o iframe dentro de uma div e depois usar a div para a rolagem.Você pode controlar a rolagem no div no IE sem problemas, o IE só tem problemas com a rolagem do iframe.Aqui está um exemplo rápido que deve resolver o problema.

<html>
    <head>
        <title>iframe test</title>

        <style>         
        #aTest { 
            width: 120px;
            height: 50px;
            padding: 0;
            border: inset 1px #000;
            overflow: auto;
        }

        #aTest iframe {
            width: 100px;
            height: 1000px;
            border: none;
        }
        </style>
    </head>
    <body>
        <div id="aTest">
            <iframe src="whatever.html" scrolling="no" frameborder="0"></iframe>
        </div>
    </body>
</html>

<iframe style="overflow:hidden;" src="about:blank"/>

deve funcionar no IE.O IE6 teve problemas com o suporte a overflow-x e overflow-y.

Outra coisa a observar é que a borda do IE no iframe só pode ser removida se você definir o atributo “frameborder” no camelCase.

<iframe frameBorder="0" style="overflow:hidden;" src="about:blank"/>

seria bom se você pudesse estilizá-lo corretamente com CSS, mas não funciona no IE.

Todas essas soluções não funcionaram para mim ou não foram satisfatórias.Com o DIV rolável, você poderia fazer com que a barra de rolagem horizontal desaparecesse, mas sempre teria a vertical.

Portanto, para o meu site, onde posso controlar a altura fixa de todos os iframes, a solução a seguir funciona muito bem.Simplesmente oculta a barra de rolagem horizontal com um DIV :)

    <!-- This DIV is a special hack to hide the horizontal scrollbar in IE iframes -->
<!--[if IE]>
<div id="ieIframeHorScrollbarHider" style="position:absolute; width: 768px; height: 20px; top: 850px; left: 376px; background-color: black; display: none;">
</div>
<![endif]-->
<script type="text/javascript">
  if (document.getElementById("idOfIframe") != null && document.getElementById("ieIframeHorScrollbarHider") != null)
  {
    document.getElementById("ieIframeHorScrollbarHider").style.display = "block";
  }
</script>

Você também pode tentar definir a largura do corpo da página incluída no iframe para 99%.

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top