ansaurus

Question

Javascript Resize

Answer 1

A:

The jQuery hide() effect would be useful here. If both Section A & Section B have a float: left Section A should expand to fill the area when Section B is hidden.

http://docs.jquery.com/Effects/hide

pygorex1 2009-12-04 05:10:57

Thanks for the answer, yes it is possible with this, however I do not want to hide the Section B.It is very hard for me to explain in English, but I would like to give this example:If you look at here: http://www.scribd.com/doc/23640532/Elisa-Hanukkah-Cards You can resize the flash object (right bottom), so it overlaps with the content. So, I will have the same function as well, also there will be a button that resize the object automatically with a fixed size. I just need a button that automatically resize it. Thanks again

murat 2009-12-04 05:29:22

For what I've understood, you want to make section A resize over section B, like layers, right? If so, leave a comment that I'll give you a light.

yoda 2009-12-04 05:35:09

yes exactly right..

murat 2009-12-04 05:41:15

Answer 2

A:

Have you tried the animate function? http://docs.jquery.com/Effects/animate

Could have Section B hide with a slide or have Section A overlap it like you mentioned just need to set the positioning, z-index, etc. properly.

mbrevoort 2009-12-04 05:15:49

hmm thanks a lot for this, I will try it.

murat 2009-12-04 05:32:41

you'll need a bit more than that.

yoda 2009-12-04 05:35:48

Answer 3

A:

something like this:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>Terminal</title>
  <script src="/js/jquery-1.3.2.min.js" type="text/javascript"></script>
  <script type="text/javascript">
   $(function () {
    $('#but').click(function (e) {
     $('#a').removeClass('big').addClass('normal');
     $('#b').hide();
     e.preventDefault();
    });
   });
  </script>
  <style type="text/css">
   .height {
    height: 100px;
    border: 1px solid black;
   }

   .big {
    width: 198px;
    float: left;
   }

   .small {
    width: 100px;
    float: left;
   }

   .normal {
    width: 300px;
    clear: both;
   }
  </style>
 </head>
 <body>
  <div><a href="#" id="but">button</a></div>
  <div id="a" class="height big">a</div>
  <div id="b" class="height small">b</div>
  <div class="height normal">c</div>
 </body>
</html>

Robert Cabri 2009-12-04 12:18:22

ansaurus

tags:

views:

answers:

Javascript Resize

related questions