[jQuery] Re: Resize an element without affecting the layout

[Liam Potter]

rather then using hover try binding the mouseenter and mouseleave events 
to it.

$("img").bind("mouseenter", function () {
   animate stuff
});
$("img").bind("mouseleave", function () {
back to normal
});

vani wrote:
I made some progress as you can see here: http://tinyurl.com/645ow4 ,
but I've ran into problem with jquery hover function. Its over and out
functions fire too many times while the cursor is still over the same
image. That happens only if I use the animate effect inside the over
function, if I just switch the size of the images it works without a
problem.

On 20 stu, 13:08, Liam Potter <[EMAIL PROTECTED]> wrote:
  
erm, best way to explain is to show an example.

lets say the image is 400x400 to get it in the center you will need to
set top and left to half that.

top:-200px;
left:-200px;

If I'm right this should work, and you can use this in jquery animate.



vani wrote:
    
That's it, weehee! Now if only I could somehow position the center of
the images to coincide with the center of parent cell? Any ideas on
that one, and perhaps compatible with jquery animated resize?
      
On 20 stu, 12:43, Liam Potter <[EMAIL PROTECTED]> wrote:
      
ok, got it.
Un comment the div in the td, and apply the position relative to that.
for some reason position relative doesn't seem to work on a table cell.
        
Ivan Svaljek wrote:
        
Here is the link, but it changes often:http://tinyurl.com/634p9s
          
On Thu, Nov 20, 2008 at 12:20 PM, Liam Potter <[EMAIL PROTECTED]
<mailto:[EMAIL PROTECTED]>> wrote:
          
    do you have a live example I can see?
          
    vani wrote:
    > That made it work in IE, but firefox and opera exhibit serious
    > problems with it. Firefox sets the top/left to document
    top/left, and
    > opera sets it to table top/left, only IE sets it to cell's top/left.
          
    > On 20 stu, 11:03, Liam Potter <[EMAIL PROTECTED]
    <mailto:[EMAIL PROTECTED]>> wrote:
          
    >> make sure you have made the td position:relative
          
    >> Ivan Svaljek wrote:
          
    >>> If I do that, they all pile up on each other at the top/left
    corner of
    >>> the table, like this:http://tinyurl.com/5tdmgm
          
    >>> On Thu, Nov 20, 2008 at 10:21 AM, Liam Potter
    <[EMAIL PROTECTED] <mailto:[EMAIL PROTECTED]>
    >>> <mailto:[EMAIL PROTECTED]
    <mailto:[EMAIL PROTECTED]>>> wrote:
          
    >>>     set the css on them to this
          
    >>>     position:absolute;
    >>>     top:0;
    >>>     left:0;
          
    >>>     vani wrote:
    >>>     > I've taken out the div, but it doesn't matter because as
    soon as I
    >>>     > change the images positioning to absolute they change
    their top/left
    >>>     > coordinates to the center of the cell, like this:
    >>>    http://tinyurl.com/5vmb42
          
    >>>     > On 20 stu, 09:57, Liam Potter <[EMAIL PROTECTED]
    <mailto:[EMAIL PROTECTED]>
    >>>     <mailto:[EMAIL PROTECTED]
    <mailto:[EMAIL PROTECTED]>>> wrote:
          
    >>>     >> is the div necessary?
    >>>     >> Try taking it out.
          
    >>>     >> vani wrote:
          
    >>>     >>> Thanks for replying, but I'm still having trouble
    making it
    >>>     work. I
    >>>     >>> tried to set the table to relative and img to absolute
    but it
    >>>     didn't
    >>>     >>> work as intended.
    >>>     >>> This is the layout of the table:
    >>>     >>> <table>
    >>>     >>> <tr>
    >>>     >>> <td><div><img /></div></td>
    >>>     >>> <td><div><img /></div></td>
    >>>     >>> <td><div><img /></div></td>
    >>>     >>> </tr>
    >>>     >>> </table>
          
    >>>     >>> ...I'm trying toresizethe img elements.
          
    >>>     >>> On 19 stu, 18:15, Liam Potter <[EMAIL PROTECTED]
    <mailto:[EMAIL PROTECTED]>
    >>>     <mailto:[EMAIL PROTECTED]
    <mailto:[EMAIL PROTECTED]>>> wrote:
          
    >>>     >>>> use absolute positioning and set the parent element
    to relative.
          
    >>>     >>>> vani wrote:
          
    >>>     >>>>> Is it possible to create an animatedresizeof an
    element
    >>>     without
    >>>     >>>>> affecting the layout of the parent element table?
    >>>     >>>>> I'm usingjQuery1.2.6 and possibly personalized
   jQueryUI, if
    >>>     >>>>> necessary.