-
Notifications
You must be signed in to change notification settings - Fork 0
/
Index.html
558 lines (532 loc) · 27.1 KB
/
Index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>MediKit</title>
<script src="https://kit.fontawesome.com/1bffa3735e.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="./CSS/home.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.0/css/fontawesome.min.css">
<link rel="stylesheet" href="./CSS/slider.css">
<link rel="stylesheet" href="./CSS/navbar.css">
<script src="./Script/slider.js"></script>
</head>
<body>
<!-- Navigation Bar -->
<header>
<div class="logo">
<img src="./data/logo.png" alt="logo">
<h2>MediKit</h2>
<div class="vertical"></div>
<div>
<p style="margin-bottom: 0; color: #4f585e; font-size: 13px;"> <i style="color: #fdc32e;" class="fa-solid fa-bolt"></i> Express delivery to </p>
<a href="" style="margin-left: 5px; color: black;">Mumbai 400001 <i class="fa-solid fa-chevron-down"></i></a>
</div>
</div>
<nav>
<div class="nav">
<!-- <button>
<img
style="width: 30px;"
src="https://img.icons8.com/windows/512/iphone--v2.png"
alt="icon">
<p>Download App</p>
</button> -->
<a href="./signup.html" style="pointer-events:all ;">
<i class="fa-regular fa-user"></i>
<p>Hello, Login</p>
</a>
<a href="">
<i class="fa-solid fa-gift"></i>
<p>Offers</p>
</a>
<a href="">
<i class="fa-solid fa-cart-plus"></i>
<p>Cart</p>
</a>
</div>
</nav>
</header>
<hr>
<!-- /////////////////////////////////////////////////////////////////////////////////////// -->
<div class="search-bar">
<div class="search">
<div>
<h3>What are you looking for?</h3>
<div>
<i style="margin-left: 10px;" class="fa-regular
fa-rectangle-list"></i>
<p style="margin-left: 10px; font-size: 14px;">Order
with prescription. </p>
<a href="" style="text-decoration: none; margin-left:
10px;">UPLOAD NOW <i class="fa-solid
fa-caret-right"></i></a>
</div>
</div>
<form>
<i class="fa-solid fa-magnifying-glass"></i>
<input type="text" placeholder="Search for healthcare">
<button type="submit"><b>Search</b></button>
</form>
</div>
</div>
<div class="categories">
<div>
<img
src="https://assets.pharmeasy.in/apothecary/images/medicine_ff.webp?dim=256x0"
alt="medicine">
<h4>Medicine</h4>
<h5>UPTO 20% OFF</h5>
</div>
<div>
<img
src="https://assets.pharmeasy.in/apothecary/images/healthcare_ff.webp?dim=256x0"
alt="Healthcare">
<h4>Healthcare</h4>
<h5>UPTO 70% OFF</h5>
</div>
<div>
<img
src="https://assets.pharmeasy.in/apothecary/images/health_blogs_ff.webp?dim=256x0"
alt="Health Blogs">
<h4>Health Blogs</h4>
<h5>UPTO 10% OFF</h5>
</div>
<div>
<img
src="https://assets.pharmeasy.in/apothecary/images/plus_ff.webp?dim=256x0"
alt="pLUS">
<h4>PLUS</h4>
<h5>UPTO 5% OFF</h5>
</div>
<div>
<img
src="https://assets.pharmeasy.in/apothecary/images/offers_ff.webp?dim=256x0"
alt="Offers">
<h4>Offers</h4>
<h5>UPTO 20% OFF</h5>
</div>
<div>
<img
src="https://assets.pharmeasy.in/apothecary/images/value_store.png?dim=256x0"
alt="Value Store">
<h4>Value Store</h4>
<h5>UPTO 50% OFF</h5>
</div>
</div>
<!-- ///////////////////////////////////////////////////////////////////////////////// -->
<section class="section1">
<div class="wrapper">
<i id="left" class="fa-solid fa-angle-left"></i>
<div class="carousel">
<a href=""><img
src="https://cdn01.pharmeasy.in/dam/banner/banner/782553ad506-STAR25.jpg"></a>
<a href=""><img
src="https://cdn01.pharmeasy.in/dam/banner/banner/59efe8fe01e-634X274.jpg"></a>
<a href=""><img
src="https://cdn01.pharmeasy.in/dam/banner/banner/2691dabe7c0-thyroid.jpg"></a>
<a href=""><img
src="https://cdn01.pharmeasy.in/dam/banner/banner/b3a4bdb683b-1.jpg"></a>
</div>
<i id="right" class="fa-solid fa-angle-right"></i>
</div>
</section>
<!-- //////////////////////////////////////////////////////////////////////////////// -->
<h1 style="margin-left: 7%; color: #5b6165;">Offers Just for You</h1>
<section class="section2">
<div class="wrapper1">
<i id="left1" class="fa-solid fa-angle-left"></i>
<div class="carousel1">
<a href="">
<div>
<img
src="https://cms-contents.pharmeasy.in/offer/c287851239f-25_off.jpg?dim=1024x0">
<p>Flag 25% off on the first 3 medicine <br> orders.</p>
</div>
</a>
<a href="">
<div>
<img
src="https://cms-contents.pharmeasy.in/offer/b1cafb3a0cf-flat_27_off.jpg?dim=1024x0">
<p>Flag 27% off + up to Rs. 1000 <br> surprise
cashback.</p>
</div>
</a>
<a href="">
<div>
<img
src="https://cms-contents.pharmeasy.in/offer/ea20b1fcb6c-11.jpg?dim=1024x0">
<p>Get flat Rs. 150 discount on a <br> minimum
transcation of Rs. 2000.</p>
</div>
</a>
<a href="">
<div>
<img
src="https://cms-contents.pharmeasy.in/offer/8bd97c910c9-10_off.jpg?dim=1024x0">
<p>Additional 10% cashback on 1st <br> medicine.</p>
</div>
</a>
<a href="">
<div>
<img
src="https://cms-contents.pharmeasy.in/offer/79c9e323814-AMAZON.jpg?dim=1024x0">
<p>Get up to Rs.600 cashback via <br> Amazon Pay.</p>
</div>
</a>
<a href="">
<div>
<img
src="https://cms-contents.pharmeasy.in/offer/063c8ae8002-test149_400x400.png?dim=1024x0">
<p>Thryoid Profile or Lipid Profile <br> or HbA1c Or
Vitamin...</p>
</div>
</a>
</div>
<i id="right1" class="fa-solid fa-angle-right"></i>
</div>
</section>
<!-- //////////////////////////////////////////////////////////////////////////////////// -->
<div class="payO"><h1>Payment Offers</h1> <a href="">View All</a></div>
<section class="section3">
<a href=""><img
src="https://cdn01.pharmeasy.in/dam/banner/banner/a93d45ef9eb-HSBC.jpg?dim=1024x0"></a>
<a href=""><img
src="https://cdn01.pharmeasy.in/dam/banner/banner/051ca0c08ef-AMAZON-PAY.jpg?dim=1024x0"></a>
<a href=""><img
src="https://cdn01.pharmeasy.in/dam/banner/banner/7297689b914-AIRTEL.jpg?dim=1024x0"></a>
</section>
<!-- ////////////////////////////////////////////////////////////////////////////////// -->
<div class="presc">
<img
src="https://assets.pharmeasy.in/apothecary/images/rx_upload.svg?dim=1440x0">
<div>
<h3>Order with Prescription</h3>
<p>Upload prescription and we will deliver your medicines</p>
<a href=""> <i class="fa-solid fa-paperclip"></i> Upload</a>
</div>
<div>
<p><b>How does this work?</b></p>
<table>
<tbody>
<tr>
<td><b>1</b></td>
<td>Upload a photo of your prescription</td>
<td><b>3</b></td>
<td>We will call you to confirm the medicines</td>
</tr>
<tr>
<td><b>2</b></td>
<td>Add delivery address and place the order</td>
<td><b>4</b></td>
<td>Now, sit back! your medicines will get delivered
at your doorstep</td>
</tr>
</tbody>
</table>
</div>
</div>
<!-- ///////////////////////////////////////////////////////////////// -->
<h1 style="font-family: 'poppins'; margin-left: 6%; color: #5b6165;">Shop
by Categories</h1>
<div class="shopByCha">
<a href="">
<div>
<div><img
src="https://cdn01.pharmeasy.in/dam/discovery/categoryImages/b26fa52dd35339e1a4e00c47b04e12d0.jpg?f=jpg?dim=256x0"
alt="medicine"></div>
<p>Pet Care</p>
</div>
</a>
<a href="">
<div>
<div><img
src="https://cdn01.pharmeasy.in/dam/discovery/categoryImages/1e622b0308ec3ab48887512eaa3488a5.png?f=png?dim=256x0"
alt="Healthcare"></div>
<p>Personal care</p>
</div>
</a>
<a href="">
<div>
<div><img
src="https://cdn01.pharmeasy.in/dam/discovery/categoryImages/cfc8ee511609321e91eb86a34f5b2885.png?f=png?dim=256x0"
alt="Health Blogs"></div>
<p>Healthcare devices</p>
</div>
</a>
<a href="">
<div>
<div><img
src="https://cdn01.pharmeasy.in/dam/discovery/categoryImages/335dae76832d370c94f0440f5ba89e1f.png?f=png?dim=256x0"
alt="pLUS"></div>
<p>Health drinks</p>
</div>
</a>
<a href="">
<div>
<div><img
src="https://cdn01.pharmeasy.in/dam/discovery/categoryImages/403b8ada7b113c7cb2e8d09e3420edfa.png?f=png?dim=256x0"
alt="Offers"></div>
<p>Beauty</p>
</div>
</a>
<a href="">
<div>
<div><img
src="https://cdn01.pharmeasy.in/dam/discovery/categoryImages/fa936f30b4563fc4abd187fb22fe5258.png?f=png?dim=256x0"
alt="Value Store"></div>
<p>Elderly care</p>
</div>
</a>
</div>
<!-- /////////////////////////////////////////////////////////////////// -->
<h1 style="font-family: 'poppins'; margin-left: 5%; color: #5b6165;">Shop
By Concern</h1>
<p style="font-family: 'poppins'; margin-left: 5%; color: #4f585e;">Products
are handpicked by experts</p>
<div class="shopByCon">
<a href="">
<div>
<div><img
src="https://cms-contents.pharmeasy.in/homepage_top_categories_images/923a665cc6f-Skin_care.png?dim=128x0"
alt="medicine"></div>
<p>Pet Care</p>
</div>
</a>
<a href="">
<div>
<div><img
src="https://cms-contents.pharmeasy.in/homepage_top_categories_images/18d2e2ee86b-Vitamins.png?dim=128x0"
alt="Healthcare"></div>
<p>Personal care</p>
</div>
</a>
<a href="">
<div>
<div><img
src="https://cms-contents.pharmeasy.in/homepage_top_categories_images/0af9ac9f350-Diabetes.webp?dim=128x0"
alt="Health Blogs"></div>
<p>Healthcare devices</p>
</div>
</a>
<a href="">
<div>
<div><img
src="https://cms-contents.pharmeasy.in/homepage_top_categories_images/24a0d2c733e-Heart.webp?dim=128x0"
alt="pLUS"></div>
<p>Health drinks</p>
</div>
</a>
<a href="">
<div>
<div><img
src="https://cms-contents.pharmeasy.in/homepage_top_categories_images/68369c9df98-Pregnancy.webp?dim=128x0"
alt="Offers"></div>
<p>Beauty</p>
</div>
</a>
<a href="">
<div>
<div><img
src="https://cms-contents.pharmeasy.in/homepage_top_categories_images/16ab65c0826-Covid.webp?dim=128x0"
alt="Value Store"></div>
<p>Elderly care</p>
</div>
</a>
</div>
<div class="article-head"> <h1>Health Articles</h1> <a href=""
style="text-decoration: name;">View All</a></div>
<p style="font-family: 'poppins'; margin-left: 6%; color: #4f585e;">Get
up-to-date on our latest health updates</p>
<div class="article">
<a href="">
<div>
<img
src="https://blog-images.pharmeasy.in/2022/11/08163433/2-3.jpg?dim=1440x0">
<p>Bariatric Surgery - Foods To Eat And Avoid</p>
</div>
</a>
<a href="">
<div>
<img
src="https://blog-images.pharmeasy.in/2022/11/09163355/1-4.jpg?dim=1440x0">
<p>Beauty Parlour Stroke Syndrome: Explained!</p>
</div>
</a>
<a href="">
<div>
<img
src="https://blog-images.pharmeasy.in/2021/01/06134714/3-1.jpg?dim=1440x0">
<p>18 Simple Home Remedies For Fungal Infections!</p>
</div>
</a>
<a href="">
<div>
<img
src="https://blog-images.pharmeasy.in/2022/11/07184015/1-3.jpg?dim=1440x0">
<p>Everything You Need To Know About Nail Psoriasis</p>
</div>
</a>
</div>
<div class="choose">
<h2>Why Choose Us?</h2>
<div>
<div>
<img
src="https://assets.pharmeasy.in/apothecary/images/family.svg?dim=96x0">
<div><h3>32 Million+</h3>
<p>Registered users as of Mar 31, 2022</p></div>
</div>
<div>
<img
src="https://assets.pharmeasy.in/apothecary/images/deliveryBoy.svg?dim=96x0">
<div><h3>36 Million+</h3>
<p>Orders on Pharmeasy till date </p></div>
</div>
<div>
<img
src="https://assets.pharmeasy.in/apothecary/images/pincodeServed.svg?dim=96x0">
<div><h3>99000+</h3>
<p>Unique items sold last 3 months</p></div>
</div>
<div>
<img
src="https://assets.pharmeasy.in/apothecary/images/locationMarker.svg?dim=96x0">
<div><h3>19500+</h3>
<p>Pin codes serviced last 3 months</p></div>
</div>
</div>
</div>
<div class="banner">
<img
src="https://assets.pharmeasy.in/apothecary/images/downloadBanner.webp?dim=1440x0&q=100">
<div>
<h1>Simplifying <br>
Healthcare <br>
Impacting Lives</h1>
<h3>Download the App for Free</h3>
<img
src="https://assets.pharmeasy.in/apothecary/images/googlePlay.svg?dim=256x0">
<img
src="https://assets.pharmeasy.in/apothecary/images/appStore.svg?dim=256x0">
</div>
</div>
<div class="about">
<p><b>Top-Selling Healthcare Products:</b> Accu-Chek Active - 100 Strips|Supradyn Multivitamin Tablets|DR Morepen BG 03 - 50 Strips|Dettol Antiseptic Liquid|Ensure Diabetes Care Vanilla Sugar Free Jar|Dettol Instant Hand Sanitizer|Everherb Shilajit|Softovac SF Powder|Pediasure Premium Chocolate Refill</p> <br>
<p><b>Top-Selling Medicines:</b> Dolovera Gel | Neurobion Forte | Chymoral Forte | Crocin Advance | Soframycin | Dexorange | Becadexamin | Folvite | Livogen | Becosules | Fourderm | Nurokind Plus | Burnol | Crocin 650 | Mintop 5 | Thrombophob | Evion 600</p> <br>
<p><b>COVID-19 Preventatives:</b> N95 Masks | Hand Sanitizers | Hand Gloves, Disinfectants, Thermometers & more!</p>
<p><b>Your One-Stop Online Pharmacy - PharmEasy</b></p>
<p> <b>We've got India Covered!</b> <br>
We now deliver in 1000+ cities and towns across 22000+ pin codes. We thereby cover every nook and corner of the country! The major cities in which we deliver include Mumbai, Kolkata, Delhi, Bengaluru, Ahmedabad, Hyderabad, Chennai, Thane, Howrah, Pune, Gurgaon, Navi Mumbai, Jaipur, Noida, Lucknow, Ghaziabad & Vadodara. <br> <br>
<b>Say Goodbye to All Your Healthcare Worries With PharmEasy!</b> <br>
PharmEasy is here to help you take it easy! We are amongst one of India's top online pharmacy and medical care platforms. It enables you to order pharmaceutical and healthcare products online by connecting you to registered retail pharmacies and get them delivered to your home. We are an online medical store, making your purchase easy, simple, and affordable! <br> <br>
<b>How Are We Making Lives Simpler With Our Online Medical Store?</b> <br>
Our doorstep delivery service is available in PAN-India across top cities like Bangalore, Delhi, Mumbai, Kolkata, Hyderabad, Gurgaon, Noida, Pune, etc. Our online medical store also allows you to choose from 1 lakh+ products including OTC products and medical equipment. PharmEasy is a one-stop online medical platform where you can also book diagnostic tests including blood tests, full-body checkups, and other preventive health check-ups at an affordable cost, right from the comfort of your home. We have partnered with trusted & certified labs that arrange for a sample pick-up from the convenience of your home. They also provide you with timely reports. <br> <br>
<b> Why Are We The Most Preferred Online Pharmacy?</b> <br> Lucrative offers on our platform allow you to make payment online and via various payment wallets at a discounted price. Alternatively, you can also choose to pay cash on delivery as we deliver the products at your doorstep. We cater to all your pharmaceutical needs and also make ordering medicines online a hassle-free experience for you. We connect you only with registered retail pharmacies & certified diagnostic labs. We ensure that healthcare is affordable to all and make the process of ordering online simple. <br> <br>
<b>Sit Back & Relax While You Get Your Essentials Delivered Every Month!</b> <br> It’s tough to remember to refill every month, especially in the case of chronic diseases. PharmEasy’s subscription service not only ensures that you are reminded of your refills but also makes sure that you are never out on your medical essentials. You will get a reminder every month and your order will be delivered at your convenience! <br> <br>
<b>Access medical and health information:</b> <br> PharmEasy delivers reliable and accurate medical information that has been carefully written, vetted and validated by our health experts. Our specialists curate high-quality and most reliable literature about medicines, illnesses, lab tests, Ayurvedic and over the counter health products. <br> <br>
<b>We Believe in ‘Simplifying Healthcare, Impacting Lives!’</b></p>
</div>
<footer>
<div>
<div>
<h3>Our Company</h3>
<a href="">About Us</a> <br>
<a href=""> Careers</a> <br>
<a href="">Blog</a> <br>
<a href="">Partner with PharamEasy</a> <br>
<a href="">Sell at PharmEasy</a> <br>
<br>
<h3>Our Services</h3>
<a href=""> Order Medicine</a> <br>
<a href=""> Healthcare Products</a> <br>
<a href=""> Lab Tests</a> <br>
<a href=""> Find Nearest Collection Center</a> <br>
<a href=""> Surgeries</a> <br>
</div>
<div>
<h3>Featured Categories</h3>
<a href="">Pet Care</a> <br>
<a href="">Personal Care</a> <br>
<a href="">Healthcare Devices</a> <br>
<a href="">Health Food and Drinks</a> <br>
<a href="">Beauty</a> <br>
<a href="">Elderly Care</a> <br>
<a href="">Home Care</a> <br>
<a href="">Skin Care</a> <br>
<a href="">Diabetic Care</a> <br>
<a href="">Health Condition</a> <br>
<a href="">Top Products</a> <br>
</div>
<div>
<h3>Need Help</h3>
<a href="">Browse All Medicines</a> <br>
<a href="">Browse All Molecules</a> <br>
<a href="">Browse All Cities</a> <br>
<a href="">Browse All Areas</a> <br>
<a href="">Browse All Stores</a> <br>
<br>
<div>
<h3>Policy Info</h3>
<a href="">Editorial Policy</a> <br>
<a href="">Privicy Policy</a> <br>
<a href="">Vulnerability Disclosure Policy</a> <br>
<a href="">Terms and Condition</a> <br>
<a href="">Customer Support Policy</a> <br>
<a href="">Return Policy</a> <br>
</div>
</div>
</div>
<div>
<div>
<h3>Download the App for Free</h3>
<img src="https://assets.pharmeasy.in/apothecary/images/googlePlay.svg?dim=256x0">
<img src="https://assets.pharmeasy.in/apothecary/images/appStore.svg?dim=128x0" >
</div>
<div>
<h3>follow us on</h3>
<i class="fa-brands fa-instagram"></i>
<i class="fa-brands fa-facebook"></i>
<i class="fa-brands fa-youtube"></i>
<i class="fa-brands fa-twitter"></i>
</div>
</div>
<div>
<div>
<p>Our Payment Pattners</p>
<img src="https://assets.pharmeasy.in/apothecary/images/gpay.png?dim=1440x0">
<img src="https://assets.pharmeasy.in/apothecary/images/paytm.png?dim=1440x0">
<img src="https://assets.pharmeasy.in/apothecary/images/phonepe.png?dim=1440x0">
<img src="https://assets.pharmeasy.in/apothecary/images/amazon.png?dim=1440x0">
<img src="https://assets.pharmeasy.in/apothecary/images/mobikwik.png?dim=1440x0">
<img src="https://assets.pharmeasy.in/apothecary/images/olamoney.png?dim=1440x0">
<img src="https://assets.pharmeasy.in/apothecary/images/maestro.png?dim=1440x0">
<img src="https://assets.pharmeasy.in/apothecary/images/mastercard.png?dim=1440x0">
<img src="https://assets.pharmeasy.in/apothecary/images/visa.png?dim=1440x0">
<img src="https://assets.pharmeasy.in/apothecary/images/rupay.png?dim=1440x0">
</div>
<p>© 2022 PharmEasy. All Rights Reserved</p>
</div>
</footer>
</body>
</html>
<script>
const carousel = document.querySelector('.carousel');
const carousel1 = document.querySelector('.carousel1');
let isDragStart = false, prevPageX, prevScrollLeft;
let firstImg = carousel.querySelectorAll('img')[0];
let arrowIcons = document.querySelectorAll('.wrapper i');
let firstImgWidth = firstImg.clientWidth + 14;
let scrollWidth = carousel.scrollWidth - carousel.clientWidth;
const showHideIcons = () => {
arrowIcons[0].style.display = carousel.scrollLeft == 0 ? 'none' : 'block';
arrowIcons[1].style.display = carousel.scrollLeft == scrollWidth ? 'none' : 'block';
}
arrowIcons.forEach(icon => {
icon.addEventListener('click', () => {
carousel.scrollLeft += icon.id == "left" ? - firstImgWidth : firstImgWidth;
showHideIcons();
})
});
</script>