Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Olá a todos,
Pessoal, é a primeira vez que eu faço algo em JS.
Eu criei uma coluna de texto que ao apertar um botão uma função é chamada e a coluna é então redimensionada.Até aí esta funcionando, mas gostaria de saber como fazer para o conteúdo excedente ser exibido somente quando a janela for redimensionada. Se não ficou claro peço que executem o código:
<html>
<head>
<title>janela</title>
<style type="text/css">
#news{
border:1px solid;
height: 60%;
width: 300px;
}
li{
list-style: none;
}
li img{
border:3px solid #666666;
}
</style>
<script type="text/javascript">
function resizeNews(){
document.getElementById("news").style.height="100%";
}
</script>
</head>
<body>
<div id="news">
<ul>
<li>
<img src="http://placehold.it/50x50" alt="img" />
lsakfdhlksajhfdlksfdhlsakjhf
ljkhfdlkasjfdhlaksjfdhlsakjfdhlsakfdj
jkshfdlkjhsafdlksajhfdlkajdshflsajkfdhlf
ljkhfdlaksdjfhlsakdjhflsakjhflaksdjhfsalkjfd
</li>
<li>
<img src="http://placehold.it/50x50" alt="img" />
lsakfdhlksajhfdlksfdhlsakjhf
ljkhfdlkasjfdhlaksjfdhlsakjfdhlsakfdj
jkshfdlkjhsafdlksajhfdlkajdshflsajkfdhlf
ljkhfdlaksdjfhlsakdjhflsakjhflaksdjhfsalkjfd
</li>
<li>
<img src="http://placehold.it/50x50" alt="img" />
lsakfdhlksajhfdlksfdhlsakjhf
ljkhfdlkasjfdhlaksjfdhlsakjfdhlsakfdj
jkshfdlkjhsafdlksajhfdlkajdshflsajkfdhlf
ljkhfdlaksdjfhlsakdjhflsakjhflaksdjhfsalkjfd
</li>
<li>
<img src="http://placehold.it/50x50" alt="img" />
lsakfdhlksajhfdlksfdhlsakjhf
ljkhfdlkasjfdhlaksjfdhlsakjfdhlsakfdj
jkshfdlkjhsafdlksajhfdlkajdshflsajkfdhlf
ljkhfdlaksdjfhlsakdjhflsakjhflaksdjhfsalkjfd
</li>
</ul>
<button type="submit" id="button" onclick="resizeNews()" >Ver mais</button>
</div>
</body>
</html>Carregando comentários...