Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Olá pessoal,
Estou desenvolvendo um site de classificados em php e achei um recurso legal em css para exibir fotos. Tudo está perfeito, porém como as imagens (fotos) são de tamanhos diversos (largura e altura), não consigo centralizar as fotos horizontalmente. Segue abaixo a idéia de como elaborei o código:
>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<style type="text/css">
#janela1 {
position:absolute;
top: 100px;
**left: 200px;**
width: 350px;
z-index: 1000;
visibility:hidden;
height: 344px;
}
#janela2 {
position:absolute;
top: 100px;
**left: 200px;**
width: 350px;
z-index: 1000;
visibility:hidden;
height: 344px;
}
#janela3 {
position:absolute;
top: 100px;
**left: 200px;**
width: 350px;
z-index: 1000;
visibility:hidden;
height: 344px;
}
</style>
<script>
function exibe1() {
document.getElementById("janela1").style.visibility="visible";
document.getElementById("janela2").style.visibility="hidden";
document.getElementById("janela3").style.visibility="hidden";
}
function exibe2() {
document.getElementById("janela1").style.visibility="hidden";
document.getElementById("janela2").style.visibility="visible";
document.getElementById("janela3").style.visibility="hidden";
}
function exibe3() {
document.getElementById("janela1").style.visibility="hidden";
document.getElementById("janela2").style.visibility="hidden";
document.getElementById("janela3").style.visibility="visible";
}
</script>
<body onLoad="exibe1()">
<?php
$foto1 = 'DSC09643.JPG';
$foto2 = 'DSC09659.JPG';
$foto3 = 'DSC09672.JPG';
?>
<div id="janela1"> <img src= <?php echo $foto1; ?> height="360"> </div>
<div id="janela2"> <img src= <?php echo $foto2; ?> height="360"> </div>
<div id="janela3"> <img src= <?php echo $foto3; ?> height="360"> </div>
<img src= <? echo $foto1; ?> onclick="exibe1();" height="60">
<img src= <? echo $foto2; ?> onclick="exibe2();" height="60">
<img src= <? echo $foto3; ?> onclick="exibe3();" height="60">
</body>
</html>
Eu já tenho uma solução para esse problema, só não sei se é possível:
Preciso saber como pegar o valor de uma variável php e transferi-la para uma variável css, assim eu pegaria a largura da foto (ex: 500 px) e jogaria esse valor devidamente calculado em left:.
Pergunta: é possível passar o valor de uma variável php para css? Se não for possível, alguém poderia me dar alguma dica de como solucionar esse meu problema de centralização?
Obrigado.
Carregando comentários...