Pergunta

Eu estou tentando criar um site que usa tecnologia semelhante à do Google Analytics Cobertura do site, mas será enquadrar o meu próprio site. I pode decidir mais tarde para alterar o tipo de sobreposição (ou eliminá-lo completamente), portanto, usando sobreposição em vez de modificar diretamente as páginas de origem é a única opção que eu estou considerando. Por agora, eu também estou testando uma barra estática posicionado na parte superior (como o Google Analytics usa também), que usará um iframe abaixo para servir a página de origem.

Aqui está o código:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">
<html>
<head>
<title>Test Overlay</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
    margin: 0;
    padding: 40px 0 0 0;
    overflow: hidden;
    font: 83%/1.4 Arial, Helvetica, Sans-Serif;
}
#bar {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100;
    width: 100%;
    min-width: 900px;
    height: 30px;
    padding: 5px 0;
    line-height: 1;
    background: #333;
    color: #fff;
    text-size: 1.2em;
}
#bar a {
    padding: 0 5px;
    color: #fff;
}
#frame {
    width: 100%;
    height: 100%;
    z-index: 10;
}
#overlay_example
{
    position: absolute;
    left: 275px;
    top: 275px;
    font-size: 14px;
}
</style>
</head>
<body>
<div id="content">
    <div id="bar">
        <a href="http://mytestsite.com" title="overlay example">Test Site</a>
    </div>
    <div>
        <iframe scrolling="auto" id="frame" src="http://www.google.com/search?hl=en&q=CSS+iframe+overlay" frameborder="0" ></iframe>
    </div>

    <div id="overlay_example">* Overlay Data *</div>
</div>
</body>
</html>

No entanto, o principal problema que tenho é que no meu site alvo (pesquisa do Google, neste caso de teste), quando as páginas se deslocar mais do que a área de tela visível, como eu rolar para baixo, a estática estadias texto sobreposição no lugar. Existe uma maneira de mudar o CSS para que as estadias de texto de sobreposição colocar ao lado o que eu quero para sobrepor no site de destino? No caso do Google resultados da pesquisa, por exemplo, se eu fosse para sobrepor texto ao lado do logotipo do Google, o texto sobreposição seria sempre ao lado do logotipo do Google, de modo que quando eu rolada para baixo o suficiente para que o logotipo não estava mais em vista , o texto de sobreposição também já não estava à vista. Isto funciona como o Google Analytics em que deseja que o texto sobreposição de âncora direito do texto que se sobrepõe.

Por favor, deixe-me saber se eu posso responder a quaisquer perguntas sobre como eu gostaria que ele funcione.

Obrigado!

Foi útil?

Solução

Devido a restrições de segurança do navegador eu não acho que você pode editar o conteúdo de um iframe de fora que iframe. Você teria que estar fazendo o estilo de dentro do iframe com css ou javascript.

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