Look here is something interesting http://www.apple.com/iphone/ ( left
bottom)
I tried to make a script like that., but I have an animating problem.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
                    "http://www.w3.org/TR/html4/loose.dtd";>
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js";></script>

  <script>
  $(document).ready(function(){
        all = $("#all > *");
                all.mouseover (
                        function() {
                                $(".curent").animate({height:'100px'});
                                $(this).animate({height:'200px'});
                                all.not(this).attr("class","cel");
                                $(this).attr("class","curent");
                        }
                );

  });
  </script>
  <style>
        .cel {
                background:#7D7D7D;
                height:100px;
                width:100px;
                border:1px solid black;
        }
        .curent {
                background:#969696;
                width:100px;
                border:1px solid black;
        }
  </style>
</head>
<body>
        <div id="all">
        <div class="cel">
                div 1
        </div>
        <div class="cel">
                div 1
        </div>
        <div class="cel">
                div 1
        </div>
        <div class="cel">
                div 1
        </div>
    </div>
</body>
</html>

I want the to have the same height overall.
Just test the script, and you will know my problem .
Please Help ME!

Reply via email to