making more interactive

index.html

@@ -5,7 +5,12 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>apple.com</title>
-    <link rel="icon" type="image/png" sizes="32x32" href="https://1000logos.net/wp-content/uploads/2016/10/Apple_logo_grey.png">
+    <link
+      rel="icon"
+      type="image/png"
+      sizes="32x32"
+      href="https://1000logos.net/wp-content/uploads/2016/10/Apple_logo_grey.png"
+    />
     <link rel="stylesheet" href="style.css" />
     <link
       rel="stylesheet"
@@ -32,8 +37,8 @@
           <li><a href="#">Support</a></li>
         </ul>
 
-        <img src="./Images/searching.jpg" class="searching" alt="">
-        <img src="./Images/bag.jpg" class="bag" id="bag-icon" alt="">
+        <img src="./Images/searching.jpg" class="searching" alt="" />
+        <img src="./Images/bag.jpg" class="bag" id="bag-icon" alt="" />
       </nav>
 
       <div class="bag-items" id="bag-items">
@@ -56,50 +61,99 @@
       </div>
 
       <div class="fcontainer">
-        <div class="fitem_1"> <img class="iphone14pro" src="https://www.apple.com/v/iphone/home/bk/images/chapternav/iphone_14_pro_light__dfhcc00ur2oi_large.svg" alt="">
-        <span class="label">iPhone 14 Pro</span>
+        <div class="fitem_1">
+          <img
+            class="iphone14pro"
+            src="https://www.apple.com/v/iphone/home/bk/images/chapternav/iphone_14_pro_light__dfhcc00ur2oi_large.svg"
+            alt=""
+          />
+          <span class="label">iPhone 14 Pro</span>
         </div>
-        <div class="fitem_2"> <img src="https://www.apple.com/v/iphone/home/bk/images/chapternav/iphone_14_light__fwknsxkf80uq_large.svg" alt="">
+        <div class="fitem_2">
+          <img
+            src="https://www.apple.com/v/iphone/home/bk/images/chapternav/iphone_14_light__fwknsxkf80uq_large.svg"
+            alt=""
+          />
           <span class="label">iPhone 14</span>
-          </div>
-        <div class="fitem_3"> <img src="https://www.apple.com/v/iphone/home/bk/images/chapternav/iphone_13_light__ewo3e0sf67o2_large.svg" alt="">
+        </div>
+        <div class="fitem_3">
+          <img
+            src="https://www.apple.com/v/iphone/home/bk/images/chapternav/iphone_13_light__ewo3e0sf67o2_large.svg"
+            alt=""
+          />
           <span class="label">iPhone 13</span>
         </div>
-        <div class="fitem_4"> <img src="https://www.apple.com/v/iphone/home/bk/images/chapternav/iphone_se_light__fhg8duy6ffau_large.svg" alt="">
+        <div class="fitem_4">
+          <img
+            src="https://www.apple.com/v/iphone/home/bk/images/chapternav/iphone_se_light__fhg8duy6ffau_large.svg"
+            alt=""
+          />
           <span class="label">iPhone SE</span>
         </div>
-        <div class="fitem_5"> <img src="https://www.apple.com/v/iphone/home/bk/images/chapternav/iphone_12_light__cxh2ll1zwpw2_large.svg" alt="">
+        <div class="fitem_5">
+          <img
+            src="https://www.apple.com/v/iphone/home/bk/images/chapternav/iphone_12_light__cxh2ll1zwpw2_large.svg"
+            alt=""
+          />
           <span class="label">iPhone 12</span>
         </div>
-        <div class="fitem_6"> <img src="https://www.apple.com/v/iphone/home/bk/images/chapternav/iphone_compare_light__f4jj7brpbvm2_large.svg" alt="">
+        <div class="fitem_6">
+          <img
+            src="https://www.apple.com/v/iphone/home/bk/images/chapternav/iphone_compare_light__f4jj7brpbvm2_large.svg"
+            alt=""
+          />
           <span class="label">Compare</span>
         </div>
-        <div class="fitem_7"> <img src="https://www.apple.com/v/iphone/home/bk/images/chapternav/airpods_light__8oj157p2476a_large.svg" alt="">
+        <div class="fitem_7">
+          <img
+            src="https://www.apple.com/v/iphone/home/bk/images/chapternav/airpods_light__8oj157p2476a_large.svg"
+            alt=""
+          />
           <span class="label">AirPods</span>
         </div>
-        <div class="fitem_8"> <img src="https://www.apple.com/v/iphone/home/bk/images/chapternav/airtag_light__cb2bmnv6aoeu_large.svg" alt="">
+        <div class="fitem_8">
+          <img
+            src="https://www.apple.com/v/iphone/home/bk/images/chapternav/airtag_light__cb2bmnv6aoeu_large.svg"
+            alt=""
+          />
           <span class="label">AirTag</span>
         </div>
-        <div class="fitem_9"> <img src="https://www.apple.com/v/iphone/home/bk/images/chapternav/accessories_light__ed5l6ipsevqu_large.svg" alt="">
+        <div class="fitem_9">
+          <img
+            src="https://www.apple.com/v/iphone/home/bk/images/chapternav/accessories_light__ed5l6ipsevqu_large.svg"
+            alt=""
+          />
           <span class="label">Accessories</span>
         </div>
-        <div class="fitem_10"> <img src="https://www.apple.com/v/iphone/home/bk/images/chapternav/iphone_ios_light__b8s4ws8o77iq_large.svg" alt="">
+        <div class="fitem_10">
+          <img
+            src="https://www.apple.com/v/iphone/home/bk/images/chapternav/iphone_ios_light__b8s4ws8o77iq_large.svg"
+            alt=""
+          />
           <span class="label">iOS 16</span>
         </div>
-        <div class="fitem_11"> <img src="https://www.apple.com/v/iphone/home/bk/images/chapternav/shop_iphone_light__b2toggskllle_large.svg" alt="">
+        <div class="fitem_11">
+          <img
+            src="https://www.apple.com/v/iphone/home/bk/images/chapternav/shop_iphone_light__b2toggskllle_large.svg"
+            alt=""
+          />
           <span class="label">Shop iPhone</span>
         </div>
       </div>
 
-
       <div class="content">
-        <div class="iphone12desc"><img src="./Images/content.jpg" alt="" /></div>
+        <div class="iphone12desc">
+          <img src="./Images/content.jpg" alt="" />
+        </div>
 
         <div class="iphone12-links">
-          <a href="#">Learn more ></a> <a href="#">Buy ></a>
+          <a href="#">Explore and enjoy! ></a>
+          <a href="#">Buy ></a>
         </div>
 
-        <div class="iphone12img"><img src="./Images/iphone12ss.jpg" alt="" /></div>
+        <div class="iphone12img">
+          <img src="./Images/iphone12ss.jpg" alt="" />
+        </div>
       </div>
 
       <div class="content2">
@@ -112,13 +166,22 @@
         <div class="proimg"><img src="./Images/iphone12pro.jpg" alt="" /></div>
       </div>
     </div>
-
-<footer id="footer">
-    <p>More ways to shop.<a href="#">Find a retailer near you.</a>Or call 00000800 040 1966.</p><br>
-    <hr>
-    <br>
-    <p>Copyright &copy; 2021 Apple Inc; All rights reserved.   <a href="#">Privacy Policy</a> |   <a href="#">Terms of Use</a>  |   <a href="#">Sales Policy</a> |   <a href="#">Legal</a> | <a href="#">Site Map</a> </p>
-</footer>
+
+    <footer id="footer">
+      <p>
+        More ways to shop.<a href="#">Find a retailer near you.</a>Or call
+        00000800 040 1966.
+      </p>
+      <br />
+      <hr />
+      <br />
+      <p>
+        Copyright &copy; 2021 Apple Inc; All rights reserved.
+        <a href="#">Privacy Policy</a> | <a href="#">Terms of Use</a> |
+        <a href="#">Sales Policy</a> | <a href="#">Legal</a> |
+        <a href="#">Site Map</a>
+      </p>
+    </footer>
     <script src="operation.js"></script>
   </body>
 </html>