Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Annes

Tem como fazer um iframe não rolar com o próprio scroll, mas sim com o

Por , em Desenvolvimento frontend

Recommended Posts

Annes    1

Annes
Postado

Explico melhor: preciso colocar uma busca do google personalizada dentro de um site (ela já me veio pronta, não tenho como fazê-la, pois não sei os parâmetros utilizados).

Se eu coloco a busca direto no site, não consigo editar a largura, o padding, a margin. Se eu coloco num iframe, fico com duas barras de rolagem, coisa que julgo abominável para um site institucional e educacional, como é o caso. Alguém tem alguma sugestão de como fazer isso?

 

Esse é o meu código...

 

<body>
   <div id="page">
 <div id="inicial">
       	<p>
        <ul>
   	    	<li> <a href="pde/artigo.html"> Artigo </a></li>
       	<li> <a href="pde/material_didatico.html"> Material Didático</a></li>
        </ul>
   	    </p>
         </div>
         <center>
         <div id="cse" style="width:95%; padding-left:20px; padding-right:20px;">Loading</div>
         <script src="http://www.google.com/jsapi" type="text/javascript"></script>
         <script type="text/javascript">
             google.load('search', '1', {language : 'pt-BR'});
             google.setOnLoadCallback(function() {
                 var customSearchControl = new google.search.CustomSearchControl('018192950835671084239:du3btnvoxyc');
                 customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);
                 customSearchControl.draw('cse');},
             true);
         </script>
         </center>

   	  <div id="rodp">
   		<p>notas de rodapé</p>
  </div>
   </div>
</body>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Sérgio Haubman    2

Sérgio Haubman
Postado

Olá amigo,

 

Estava dando uma olhada no seu código, é possível sim editar largura, altura, padding e margim, esse script monta o código html após renderizado, deste modo você pode usar um complemento do firefox como o firebug ou pressionando F12 no chrome e também no ie, mas o do ie não recomendo por ser muito ruim de utilizar, utilize o do firefox para navegar pelas tags e pegar as classes e id's para estilizar a pagina, fiz o teste e deu certo.

 

Algumas de classes que você pode estilizar:

 

.gsc-control-cse - Box Geral

.gsc-control-cse-pt-BR - Box Geral

.gsc-wrapper - BOX com resultados

.gsc-thinWrapper - BOX com resultados

.gsc-tabsArea - Abas do resultado

.gsc-input área do campo de texto e botão de pesquisa

.gsc-input input editar campo de texto

 

Da para fazer muita coisa com essas classes.

 

Sobre o iframe você consegui tirar o scroll com a opção overflow-x:hidden; - overflow-y:hidden; ou as duas overflow:hidden;

 

E ainda temos a opção de editar por javascript

 

Espero ter ajudado

 

Grande abraço.

 

Att

Sérgio Martins

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito