Swap Image with Content

[Locke]

Hey Hi!

well I’m starting to learn jquery and I can say that I’m newbie trying to create something in jquery …… so I ask for some Master Jedi that can help me in this issue….

I’m trying to swap an image with some content I mean:

Code:

The Nonsense Society

Art, Music, Word
Website

The Nonsense Society

Art, Music, Word
Website

and using this jquery for the Swap propose:

Code:

$(document).ready(function(){

$(“div.captions”).css(‘display’,’none’);

$(‘.branch.swap’).hover(function(){
$(“.cover”, this).stop().animate({opacity:0},{queue:false,duration:300});
$(“div.captions”, this).css(‘display’,’block’);

}, function() {

$(“.cover”, this).stop().animate({opacity:1},{queue:false,duration:300});
$(“div.captions”, this).css(‘display’,’none’);
});
});

But I think the jquery is wrong….. I’m mean it works but … something tells me that The code is wrong hahaha..

well hope somone can take some time to read this and give a hand

thanks

and see’a

[dcp3450]

what do you mean

Quote:

I’m mean it works but … something tells me that The code is wrong

[noahgelman]

Your jQuery is fine. If you’re having any problem, it might be because you have your section and div closing tags backwards

[Locke]

"noahgelman" wrote:

Your jQuery is fine. If you’re having any problem, it might be because you have your section and div closing tabs backwards

Owh ! i did not notice that.. and in fact that solve a issue that I had in IE8….

Thnaks a lot

[jasikamarshel]

You use this code it help you
<table border=1 >
<tr>
<td>
<a href="#">
<p id="program2">
. <span>program two tag line for SEO; hidden behind image</span>
&nbsp; <!– space are important –>
</p>
</a>
</td>
<td>

</td>
</tr>
<tr>
<td>
<a href="#">
<p id="program3">
<span>program three tag line for SEO; hidden behind image</span>
&nbsp; <!– space are important –>
. </p>
</a>
</td>
<td>

</td>
</tr>
<tr>
<td>
. <a href="#">
<p id="program1">
<span>program one tag line for SEO; hidden behind image</span>
&nbsp; <!– space are important –>
</p>
. </a>
</td>
<td>
Satya Prakash – on PHP platform
</td>
</tr>
</table>

[noahgelman]

Do NOT use that code. It’s terrible.

[Locke]

Thanks for the recommendations

Yes the code is working fine, but IE is the exception I don’t know why, but all png in ie7 and 8 are showing the black border in all png after hover…

I tryed every pngfix including unitpngfix > this one erease all png’s after hover.

anyone know why png’s loose transparency in IE ?

thanks!

[Locke]

Because I give up trying PNG jajaja I use simple backgrounds and gifs..

check out my concept:

Code:

http://sabormexicano.com/new/on/

[Author]

Posts