jquery+css3图像气泡文字说明 图片标注

一款基于jQuery+CSS3实现的类似地图对某一地点增加标注，点击标注弹出详细信息。相关js代码jQuery(function(){ // initialize of labels $('.labels a#label1').fadeIn(100).effect('bounce', { times:3 }, 300, function() { $('.labels a#label2').fadeIn(100).effect('bounce', { times:3 }, 300, function() { $('.labels a#label3').fadeIn(100).effect('bounce', { times:3 }, 300, function() { $('.labels a#label4').fadeIn(100).effect('bounce', { times:3 }, 300, function() { $('.labels a#label5').fadeIn(100).effect('bounce', { times:3 }, 300, function() { $('.labels a#label6').fadeIn(100).effect('bounce', { times:3 }, 300); }); }); }); }); }); // description close $('.description .close').click(function() { $(this).parent().fadeOut(500); return false; }); // display description on click by labels $('.labels a').click(function() { $('.description p').html( $(this).find('p').html() ).parent().fadeIn(500); return false; }); // close dialog on click outside $('.container').click(function() { $('.description').fadeOut(500); });});

在线演示        积分下载        6毛下载        砍两刀下载