Dúvida : Obter Dinamicamente a altura de uma Div e aplicar a outra

1. Dúvida : Obter Dinamicamente a altura de uma Div e aplicar a outra

Gordon Freeman
GordonFreeman

(usa Ubuntu)

Enviado em 01/08/2012 - 17:42h

Boa tarde pessoal !!!
Venho recorrer ao fórum mais uma vez para tentar resolver um problema.Necessito capturar a altura de uma Div e aplicar a outra Div, sei que existem vários scripts Js que fazem isso e até já usei alguns , mas no meu caso não funciona pois tem um problema ,a Div que vai servir de base para capturar a altura não terá altura definida inicialmente , ela vai ter a altura definida pela página que vai abrir dentro dela dinâmicamente com requisição ajax, então eu teria que obter a altura da div dinamicamente, ou seja , no momento em que a página é aberta dentro dela, depois disso tenho que aplicar essa altura a outra div que contém um menu vertical do lado esquerdo .
Desde já, obrigado a todos.


  


2. Re: Dúvida : Obter Dinamicamente a altura de uma Div e aplicar a outra

Raimundo Alves Portela
rai3mb

(usa Outra)

Enviado em 01/08/2012 - 21:53h

Crie uma variável , ai assim que a div receber conteúdo adicione a essa variável o valor da altura dela e depois aplique ao menu...


Exemplo:


var hDiv = 0;
$.ajax({
...
success: function(data, textStatus) {
$('#id_do_div).html(data); # recebendo o conteudo via ajax na div
hDiv = $('#id_do_div').height(); # obtem a altura
$('#id_div_menu').height(hDiv); # configura a nova altura

}
});




3. Re: Dúvida : Obter Dinamicamente a altura de uma Div e aplicar a outra

Gordon Freeman
GordonFreeman

(usa Ubuntu)

Enviado em 01/08/2012 - 23:21h

rai3mb escreveu:

Crie uma variável , ai assim que a div receber conteúdo adicione a essa variável o valor da altura dela e depois aplique ao menu...


Exemplo:


var hDiv = 0;
$.ajax({
...
success: function(data, textStatus) {
$('#id_do_div).html(data); # recebendo o conteudo via ajax na div
hDiv = $('#id_do_div').height(); # obtem a altura
$('#id_div_menu').height(hDiv); # configura a nova altura

}
});



Ok rai3mb, mais uma vez salvando a pátria rsrrs...,vlw. Bom, entendi o esquema, eu havia pensado nisso tb , mas não sabia como implementar.Amanhã eu vou quebrar a cabeça para tentar resolver isso e volto aqui.
Valeu de novo Brother !!! Abraço.


4. Re: Dúvida : Obter Dinamicamente a altura de uma Div e aplicar a outra

Gordon Freeman
GordonFreeman

(usa Ubuntu)

Enviado em 02/08/2012 - 16:49h

rai3mb infelizmente não consegui implementar,vou ser honesto, meu conhecimento de JS ainda é muito limitado estou começando mesmo.
Meu código está assim :

<script type="text/javascript">
var hDiv = 0;
$.ajax({
success: function(data, textStatus) {
$('#paginas').html(data); //recebendo o conteudo via ajax na div
hDiv = $('#paginas').height(); // obtem a altura
$('#menu').height(hDiv); // configura a nova altura
}
});

</script>

"páginas" é a div onde as páginas serão abertas com requisição ajax, "menu" é a div lateral que deve acompanhar a altura da div "páginas". É o seguinte, a div #paginas não terá altura definida inicialmente, então eu teria que "disparar" a função JS para capturar a altura no momento em que o link que chama a página e acionado é isso ?
Obrigado mais uma vez .


5. Re: Dúvida : Obter Dinamicamente a altura de uma Div e aplicar a outra

Raimundo Alves Portela
rai3mb

(usa Outra)

Enviado em 02/08/2012 - 23:22h

Vc tem que capturar a altura após o div receber conteúdo...


E a menos que vc tenha configurado antes, falta configurar a url, datatype, type do $.ajax...

<script type="text/javascript">
var hDiv = 0;
$.ajax({
url: 'arquivo.php',
dataType: 'html',
type: 'POST',
success: function(data, textStatus) {
$('#paginas').html(data); //recebendo o conteudo via ajax na div
hDiv = $('#paginas').height(); // obtem a altura
$('#menu').height(hDiv); // configura a nova altura
}
});

</script>



6. Re: Dúvida : Obter Dinamicamente a altura de uma Div e aplicar a outra

Raimundo Alves Portela
rai3mb

(usa Outra)

Enviado em 09/08/2012 - 00:44h

Resolveu o problema? Lembrei do tópico porque acabei de usar esse recurso no meu site (oficina) : http://portela.tendalinux.com/

* Veja que a lateral de twitter acompanha a div de conteúdo do site....


7. Re: Dúvida : Obter Dinamicamente a altura de uma Div e aplicar a outra

Gordon Freeman
GordonFreeman

(usa Ubuntu)

Enviado em 09/08/2012 - 18:11h

rai3mb escreveu:

Resolveu o problema? Lembrei do tópico porque acabei de usar esse recurso no meu site (oficina) : http://portela.tendalinux.com/

* Veja que a lateral de twitter acompanha a div de conteúdo do site....

Olá rai3mb, blz rapaz !!!Então , na verdade eu não consegui entender o seu código não , como disse sou um bebê inda no Js rsrrs, tempo que estudar, mas tenho que terminar o site urgente para entregar, aí tenho que tirar um tempo depois para começar do zero.

<script type="text/javascript">
var hDiv = 0;
$.ajax({
url: 'arquivo.php',
dataType: 'html',
type: 'POST',
success: function(data, textStatus) {
$('#paginas').html(data); //recebendo o conteudo via ajax na div
hDiv = $('#paginas').height(); // obtem a altura
$('#menu').height(hDiv); // configura a nova altura
}
});
</script>

Bom, eu não sei qual a função do código :
 url: 'arquivo.php', 
.Tenho uma página index.php, essa página possui um menu do lado esquerdo e uma div do lado direito onde as páginas serão abertas, eu não entendi a lógica do seu código .Eu tinha que pegar a altura da Div conteúdo no momento que a página abrir dentro dela e aplicar na div menu.
A solução que encontrei foi usar a técnica de Faux colun, somente com CSS , mas não ficou legal pois a div menu possui cantos arredondados , fiz ganbiarra mesmo.Vou sair agora , mas quando chegar vou dar uma olhada no seu site para ver se entendo.
Valeu de novo Brother !!!!


8. Re: Dúvida : Obter Dinamicamente a altura de uma Div e aplicar a outra

Raimundo Alves Portela
rai3mb

(usa Outra)

Enviado em 10/08/2012 - 00:36h

Você disse que estava usado requisição ajax, pensei então que você com o jquery, o código que passei é comum para isso:

Comentado:

<script type="text/javascript">
var hDiv = 0;
// requisição ajax com jquery
$.ajax({
url: 'arquivo.php', // url do arquivo que vai retornar os dados (nesse caso php)
dataType: 'html', // tipo de informação retornada (poderia ser text, json)
type: 'POST', // forma de envio dos dados
success: function(data, textStatus) { // funcao executada em caso de sucesso na requisição
$('#paginas').html(data); //recebendo o conteudo via ajax na div
hDiv = $('#paginas').height(); // obtem a altura
$('#menu').height(hDiv); // configura a nova altura
}
});
</script>


Enfim esse é o código base para a requisição e manipulação do resultado, ainda existe o tratamento de erros, etc..


9. Re: Dúvida : Obter Dinamicamente a altura de uma Div e aplicar a outra

Gordon Freeman
GordonFreeman

(usa Ubuntu)

Enviado em 10/08/2012 - 15:20h

rai3mb escreveu:

Você disse que estava usado requisição ajax, pensei então que você com o jquery, o código que passei é comum para isso:

Comentado:

<script type="text/javascript">
var hDiv = 0;
// requisição ajax com jquery
$.ajax({
url: 'arquivo.php', // url do arquivo que vai retornar os dados (nesse caso php)
dataType: 'html', // tipo de informação retornada (poderia ser text, json)
type: 'POST', // forma de envio dos dados
success: function(data, textStatus) { // funcao executada em caso de sucesso na requisição
$('#paginas').html(data); //recebendo o conteudo via ajax na div
hDiv = $('#paginas').height(); // obtem a altura
$('#menu').height(hDiv); // configura a nova altura
}
});
</script>


Enfim esse é o código base para a requisição e manipulação do resultado, ainda existe o tratamento de erros, etc..


valeu rai3mb !!! Então na verdade o seu código também chama a página por requisição Ajax além de executar a função de aplicar a altura da Div conteúdo na Div menu , no meu código está separado , tenho a função jquery que é aplicada aos links do menu, esses links é que chamam as páginas para abrir dentro da da Div conteúdo.Implementando parte do seu código daria para executar somente a função de igualar a altura das divs , ou para funcionar eu terei que executar tb a parte de requisição ajax para chamar as páginas .Quando chegar em casa vou tentar implementar . Valeu brother.


10. Re: Dúvida : Obter Dinamicamente a altura de uma Div e aplicar a outra

Raimundo Alves Portela
rai3mb

(usa Outra)

Enviado em 10/08/2012 - 22:51h

Não entendi ;-), teria que ver o código pra entender melhor, mas a lógica é que após ter conteúdo da DIV é que vc pode usar o $().height() para obter o tamanho e logo em seguida atribui à outra DIV.


11. Re: Dúvida : Obter Dinamicamente a altura de uma Div e aplicar a outra

Gordon Freeman
GordonFreeman

(usa Ubuntu)

Enviado em 10/08/2012 - 23:51h

rai3mb escreveu:

Não entendi ;-), teria que ver o código pra entender melhor, mas a lógica é que após ter conteúdo da DIV é que vc pode usar o $().height() para obter o tamanho e logo em seguida atribui à outra DIV.


Putz, eu devia ter passado meu código antes para evitar confusão ,foi mal brother... Bom ,meu código está assim : os links do menu estão dessa forma
   

<div id ="menu" > <li><a href="#" id="link1">Projeto</a> </li>
</div>
O código que faz a requisição é esse :
  
<script>
$(document).ready(function() {

$("#link1").click(function(event) {
//Evento click no link1
$.ajaxSetup({cache: false});
//Limpa o cash
$("#paginas").load('paginas/pagina1.php');//Abre pagina1.php dentro da div paginas
})
<script>

Passo a Id "link1" para a função que faz a requisição e abre pagina1.php dentro da Div paginas , é nesse momento que deveria pegar altura da div paginas e aplicar na div Menu , eis o problema que está me tirando o sono rsrrs. Com a sua função daria para aplicar a altura da div conteudo na div menu mesmo que a parte da requisição esteja sendo feita separadamente por outra função ?Amanhã vou dar uma fuçada no código pra ver.
Cara, só tenho a agradecer até agora pela sua atenção e disponibilidade em ajudar, valeu mesmo Brother .Grande abraço.


12. Re: Dúvida : Obter Dinamicamente a altura de uma Div e aplicar a outra

Gordon Freeman
GordonFreeman

(usa Ubuntu)

Enviado em 11/08/2012 - 00:07h

Entrei agora no seu site ,muito bacana suas dicas .Show de bola o script para atualizar a página dinamicamente a cada X segundos, muito útil mesmo, para Banners e outros elementos que devem ser atualizados dinamicamente a cada intervalo de tempo. :-)



01 02



Patrocínio

Site hospedado pelo provedor RedeHost.
Linux banner

Destaques

Artigos

Dicas

Tópicos

Top 10 do mês

Scripts