Salut
je me mets à Jquery (et à Javascript) et je tente un petit script.
Je vous donne le code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style type="text/css">
#news {
width:300px;
height:300px;
margin: 0 auto 0 auto;
background-color:aqua;
padding:10px;
}
#news_in {
width:260px;
height:205px;
background-color:yellow;
margin:10px;
overflow:hidden;
}
#news_bloc_move {
width:260px;
height:205px;
}
.news_bloc_item {
height:100px;
background-color:pink;
margin-bottom:5px;
}
.news_bloc_item p{
margin:0;
}
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".down").click(function(){
var top=parseInt($("#news_items_bloc").css("margin-top"));
$("#news_bloc_move").animate({
marginTop: "+=210px"
}, "slow");
});
$(".up").click(function(){
$("#news_bloc_move").animate({
marginTop: "+=-210px"
}, "slow");
});
});
</script>
</head>
<body>
<div id="news">
<a href="#" class="up">Up
<a href="#" class="down">Down
<div id="news_in">
<div id="news_bloc_move">
<?php
for ($i=1;$i<10;$i++) {
echo "<div class=\"news_bloc_item\">\n";
echo "Bloc".$i." \n";
echo "</div>\n";
}
?>
</div>
</div>
</div>
</body>Bon c'est classique. Vous remarquerez tout de suite mon soucis.
Si dès le début je "monte" ou si tout à la fin je "descends" trop, je n'ai plus rien à afficher et ça continu toujours à descendre.
Je voudrais donc cacher (avec hide) une des flèches au début ou tout à la fin avec une structure conditonnelle du style:
if ( top<0 ) {je cache la flèche vers le haut }
ou
if ( top> un certain nombre de pixel(multiple de 210) ) {je cache la flèche vers le bas}
J'espère avoir été assez clair.
Si vous avez une idée, je suis preneur !
Merci.