Advertisement
Guest User

Untitled

a guest
Jul 29th, 2011
8,768
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.84 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4.  
  5. <title>Select Gifts For Friends </title>
  6. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  7. <style type="text/css">
  8. <!--
  9. #background {
  10. position: relative;
  11. height: 600px;
  12. width: 900px;
  13. }
  14.  
  15. #header {
  16. position:absolute;
  17. height:150px;
  18. width:900px;
  19. background:#6F3;
  20. }
  21. #selectgift
  22. {
  23. position:absolute;
  24. height:50px;
  25. width:900px;
  26. top: 150px;
  27. left: 0px;
  28. background:#00C;
  29. }
  30. #pic1
  31. {
  32. position:absolute;
  33. width:300px;
  34. height:187.5px;
  35. top:200px;
  36. left:0px;
  37. background:#FF0;
  38. }
  39. #pic2
  40. {
  41. position:absolute;
  42. width:300px;
  43. height:187.5px;
  44. top:200px;
  45. left:300px;
  46. background:#F03;
  47. }
  48. #pic3
  49. {
  50. position:absolute;
  51. width:300px;
  52. height:187.5px;
  53. top:200px;
  54. left:600px;
  55. background:#F0F;
  56.  
  57. }
  58.  
  59. #pic4
  60. {
  61. position:absolute;
  62. width:300px;
  63. height:187.5px;
  64. top:387.5px;
  65. left:0px;
  66. background:#C6F;
  67. }
  68.  
  69. #pic5
  70. {
  71. position:absolute;
  72. width:300px;
  73. height:187.5px;
  74. top:387.5px;
  75. left:300px;
  76. background:#F90;
  77. }
  78. #pic6
  79. {
  80. position:absolute;
  81. width:300px;
  82. height:187.5px;
  83. top:387.5px;
  84. left:600px;
  85. background:#966;
  86. }
  87.  
  88.  
  89. #footer {
  90. position:absolute;
  91. height:25px;
  92. width:900px;
  93. top: 575px;
  94. left: 0px;
  95. background:#C33;
  96. }
  97.  
  98. -->
  99. </style>
  100. </head>
  101.  
  102.  
  103. <body>
  104. <div id="background">
  105. <div id="header">A Header here </div>
  106. <div id="selectgift">Select Gift Here !
  107. <form name="form1">
  108. <select name="category" onchange="displayPics()">
  109. <option name = "choclates">choclates</option>
  110. <option name="mugs">mugs</option>
  111. <option name="teddy bears">teddy bears</option>
  112. <option name="Wrist Bands">Wrist Bands</option>
  113. </select>
  114. </form>
  115. </div>
  116. <div id="footer">Copyright Galsky Social</div>
  117. <!-- <div id="pic1"><img src="images/1.jpg" align="middle"/></div>
  118. <div id="pic2"><img src="images/2.jpg" align="middle"/></div>
  119. <div id="pic3"><img src="images/3.jpg" align="middle"/></div>
  120. <div id="pic4"><img src="images/4.jpg" align="middle"/></div>
  121. <div id="pic5"><img src="images/5.jpg" align="middle"/></div>
  122. <div id="pic6"><img src="images/6.jpg" align="middle"/></div>
  123.  
  124. -->
  125.  
  126. <script type="text/javascript">
  127. function displayPics()
  128. {
  129. alert("In function ");
  130. var i = 1;
  131. var a = document.form1.category.selectedIndex;
  132. var img_src;
  133. if(a == 1)
  134. img_src = 'images/choclates';
  135. else if(a == 2)
  136. img_src = 'images/mugs';
  137. else if(a == 3)
  138. img_src = 'images/teddybears';
  139. else
  140. img_src = 'wristbands';
  141.  
  142. for (i = 1;i<7;i++)
  143. {
  144. document.write('<div id="pic');
  145. document.write(i);
  146. document.write('"><img src="');
  147. document.write(img_src);
  148. document.write('/');
  149. document.write(i);
  150. document.write('.jpg" align="middle"/></div>' );
  151. }
  152.  
  153.  
  154. </script>
  155.  
  156.  
  157.  
  158.  
  159.  
  160.  
  161.  
  162.  
  163.  
  164.  
  165. </div>
  166. </body>
  167.  
  168.  
  169. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement