1.copy -past below code toyour html page
2.download jquery.js file from jquery.com
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title>Untitled Document</title>
<style type=”text/css”>
<!–
.box_performer {height:268px; width:500px; background:url(images/bg_box.gif); border:1px solid #b7b7b7;}
.box_performer img {border:0;}
.box_performer .title {float:left; height:24px; font-family:Tahoma; font-size:25px; color:#0d89d1; margin-top:12px; margin-left:20px; width:482px;}
.looking {float:left; width:200px; height:227px;}
.looking ul {margin:0; padding:0; list-style-type:none;}
.looking li {margin:10px 0 0 18px; padding:0;}
.looking li a { display:block; font-family:Tahoma; font-size:13px; font-weight:bold; color:#0d89d1; text-decoration:none; padding-left:20px; line-height:16px;}
.looking li a:hover {background:url(images/bullet_arrow.gif) no-repeat left top; color:#809e13;}
–>
</style>
</head>
<body >
<div>
<div>Performer</div>
<div>
<ul>
<li><a href=”#” onclick=”showdiv(‘firstdiv’)”>Looking for work</a></li>
<li><a href=”#” onclick=”showdiv(‘seconddiv’)”>Looking for Your Event</a></li>
</ul>
<div align=”center” style=”margin-top:14px;” id=”imgfirstdiv”><img src=”images/microphone.gif” /></div>
<div align=”center” style=”margin-top:14px;” id=”imgseconddiv”><img src=”images/performer.gif” /></div>
</div>
<div align=”justify” style=”float:left; width:275px; height:177px; font-family:Tahoma; font-size:12px; color:#313d00; padding-top:12px; padding-left:5px; padding-right:20px; display:none” id=”firstdiv”>
Are you a Speaker or a Speaker’s Agent? Are you an Entertainer e.g. Comedian, Musician e.g. Singer, DJ, MC, Presenter, Actor, Facilitator, Interviewer, Fundraiser, Auctioneer, Narrator, Reporter, Toastmaster, Trainer, Coach, Poet, Instructor, Moderator, Host etc…looking for work or to grow your portfolio of work? SpeechGap.com can help you find work either locally or from other exciting places. It’s free to sign up and become a service provider immediately. Join us now, look for work straightaway and start making money today.
</div>
<div align=”justify” style=”float:left; width:275px; height:177px; font-family:Tahoma; font-size:12px; color:#313d00; padding-top:12px; padding-left:5px; padding-right:20px; display:none” id=”seconddiv”>
Looking for that great entertaining Speaker or Performer for your event?
We have Speakers and Performers to deliver your message as well as entertain your audience. On SpeechGap.com, checkout their profile, watch past performance, view feedback, and do due diligence on recommendations. Makes your job easier?
Its free to join and today you can search for that great Speaker, Comedian, Singer, DJ, MC, Presenter, Toastmaster, Poet, Host etc…either locally or someone with an international perspective at the best competitive price.
</div>
<div style=”height:36px; float:left;”><a href=”#”><img src=”images/join_now.gif” /></a></div>
</div>
<script type=”text/javascript” src=”jquery.js”></script>
<script type=”text/javascript”>
function showdiv(obj)
{
if(obj==”seconddiv”)
{
$(“#firstdiv”).hide(“slow”);
$(“#imgfirstdiv”).hide(“slow”);
$(“#seconddiv”).show(“slow”);
$(“#imgseconddiv”).show(“slow”);
}
else
{
$(“#seconddiv”).hide(“slow”);
$(“#imgseconddiv”).hide(“slow”);
$(“#firstdiv”).show(“slow”);
$(“#imgfirstdiv”).show(“slow”);
}
}
showdiv(‘firstdiv’);
</script>
</body>
</html>