That would be simpler *but* I'm wanting to display some text above and below the image when they hover.
Hover over a pooch <http://www.google.com.au/images?q=dogs&biw=1246&bih=985>and you'll see what I mean. :-) - Mike On Wed, Aug 18, 2010 at 10:44 PM, Dylan Fogarty-MacDonald <dylan.fm@ gmail.com> wrote: > Hey Mike, > > You could achieve something like this with CSS and no JavaScript: > > http://gist.github.com/534548 > > I'm not sure how this will behave in some browsers. IE6 for one won't like > div:hover. > > <http://gist.github.com/534548>You can go and enhance it with CSS3 box > shadows and even transitions for the zoom effect. > > Dylan > > > On 18 August 2010 22:34, Mike Bailey <m...@bailey.net.au> wrote: > >> Thanks Mikel, that looks like what I need! :-) >> >> - Mike >> >> On Wed, Aug 18, 2010 at 10:33 PM, Mikel Lindsaar <raasd...@gmail.com>wrote: >> >>> I'm no jQuery king, but this should get you started on popping the images >>> up... you will need to fix the positioning of the image as well by adding >>> the appropriate style. >>> >>> jQuery(function($) { >>> $('img').live('hover', function(){ >>> $(this).animate({ height: $(this).attr('data-height'), >>> width: $(this).attr('data-width') }, >>> 2, 'swing'); >>> }); >>> >>> >>> Mikel >>> >>> >>> >>> On 18/08/2010, at 10:16 PM, Mike Bailey wrote: >>> >>> That looks pretty cool Julio! >>> >>> Right now I'm wondering how to make a div popup when users hover over the >>> image. >>> It needs to grab some values from the image element like google does: >>> >>> <img class="rg_hi" id="rg_hi" src="blah" width="272" height="185" >>> data-width="272" data-height="185" <----- Use these to calculate size of >>> onhover popup >>> style="width:272px;height:185px"> >>> >>> I'm sure it's a simple one. :-) >>> >>> - Mike >>> >>> On Wed, Aug 18, 2010 at 9:59 PM, Julio Cesar Ody <julio...@gmail.com>wrote: >>> >>>> Yeah, >>>> >>>> http://desandro.com/resources/jquery-masonry/ >>>> >>>> I'm building an iPhone/iPad web app that uses it for image search >>>> >>>> http://github.com/juliocesar/domino >>>> >>>> Counts as a "ghost of done" now that I said so on the Internet before >>>> it's done :) >>>> >>>> >>>> >>>> On Wed, Aug 18, 2010 at 9:50 PM, Mike Bailey <m...@bailey.net.au> >>>> wrote: >>>> > http://www.google.com.au/images?q=dogs&biw=1246&bih=985 >>>> > Have you seen Google's new look image search? Besides being super >>>> fast, it's >>>> > got a nice way of showing an image's details on hover. >>>> > I'd like to implement a similar hover display on Goodfordogs.org. Can >>>> anyone >>>> > point me to a simple example? >>>> > thanks, >>>> > Mike >>>> > >>>> > -- >>>> > >>>> > http://Goodfordogs.org - Adopt a dog or cat >>>> > >>>> > -- >>>> > You received this message because you are subscribed to the Google >>>> Groups >>>> > "Ruby or Rails Oceania" group. >>>> > To post to this group, send email to rails-ocea...@googlegroups.com. >>>> > To unsubscribe from this group, send email to >>>> > rails-oceania+unsubscr...@googlegroups.com<rails-oceania%2bunsubscr...@googlegroups.com> >>>> . >>>> > For more options, visit this group at >>>> > http://groups.google.com/group/rails-oceania?hl=en. >>>> > >>>> >>>> >>>> >>>> -- >>>> http://crazyhollywood.org >>>> >>>> -- >>>> You received this message because you are subscribed to the Google >>>> Groups "Ruby or Rails Oceania" group. >>>> To post to this group, send email to rails-ocea...@googlegroups.com. >>>> To unsubscribe from this group, send email to >>>> rails-oceania+unsubscr...@googlegroups.com<rails-oceania%2bunsubscr...@googlegroups.com> >>>> . >>>> For more options, visit this group at >>>> http://groups.google.com/group/rails-oceania?hl=en. >>>> >>>> >>> >>> >>> -- >>> >>> http://Goodfordogs.org - Adopt a dog or cat >>> >>> >>> -- >>> You received this message because you are subscribed to the Google Groups >>> "Ruby or Rails Oceania" group. >>> To post to this group, send email to rails-ocea...@googlegroups.com. >>> To unsubscribe from this group, send email to >>> rails-oceania+unsubscr...@googlegroups.com. >>> For more options, visit this group at >>> http://groups.google.com/group/rails-oceania?hl=en. >>> >>> >>> -- >>> You received this message because you are subscribed to the Google Groups >>> "Ruby or Rails Oceania" group. >>> To post to this group, send email to rails-ocea...@googlegroups.com. >>> To unsubscribe from this group, send email to >>> rails-oceania+unsubscr...@googlegroups.com<rails-oceania%2bunsubscr...@googlegroups.com> >>> . >>> For more options, visit this group at >>> http://groups.google.com/group/rails-oceania?hl=en. >>> >> >> >> >> -- >> >> http://Goodfordogs.org - Adopt a dog or cat >> >> -- >> You received this message because you are subscribed to the Google Groups >> "Ruby or Rails Oceania" group. >> To post to this group, send email to rails-ocea...@googlegroups.com. >> To unsubscribe from this group, send email to >> rails-oceania+unsubscr...@googlegroups.com<rails-oceania%2bunsubscr...@googlegroups.com> >> . >> For more options, visit this group at >> http://groups.google.com/group/rails-oceania?hl=en. >> > > -- > You received this message because you are subscribed to the Google Groups > "Ruby or Rails Oceania" group. > To post to this group, send email to rails-ocea...@googlegroups.com. > To unsubscribe from this group, send email to > rails-oceania+unsubscr...@googlegroups.com<rails-oceania%2bunsubscr...@googlegroups.com> > . > For more options, visit this group at > http://groups.google.com/group/rails-oceania?hl=en. > -- http://Goodfordogs.org - Adopt a dog or cat -- You received this message because you are subscribed to the Google Groups "Ruby or Rails Oceania" group. To post to this group, send email to rails-ocea...@googlegroups.com. To unsubscribe from this group, send email to rails-oceania+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/rails-oceania?hl=en.