Skip to main content

Autoplay carousel WITH HTML LANGUAGE

 

Autoplay carousel

HTML 


<div id="carousel"> <div id="slide-container"> <div class="slide" data-slideIndex="0"> <div class="slide-banner">Tour the Empire State Building! <a href="">Buy tickets now.</a></div> <img width="1200" height="600" src="./newyork.jpg"> </div> <div class="slide" data-slideIndex="1"> <div class="slide-banner">Ride the Shinkansen! <a href="">Buy tickets now.</a></div> <img width="1200" height="600" src="./tokyo.jpg"> </div> <div class="slide" data-slideIndex="2"> <div class="slide-banner">Discover relaxation! <a href="">Buy tickets now.</a></div> <img width="1200" height="600" src="./beach.jpg"> </div> <div class="slide" data-slideIndex="3"> <div class="slide-banner">See penguins! <a href="">Buy tickets now.</a></div> <img width="1200" height="600" src="./penguins.jpg"> </div> <div class="slide" data-slideIndex="4"> <div class="slide-banner">Take a ride on the wheel! <a href="">Buy tickets now.</a></div> <img width="1200" height="600" src="./wheel.jpg"> </div> </div> <div id="back-button" class="arrow back">←</div> <div id="forward-button" class="arrow forward">→</div> <div class="slide-indicators"> <div class="slide-indicator active"></div> <div class="slide-indicator"></div> <div class="slide-indicator"></div> <div class="slide-indicator"></div> <div class="slide-indicator"></div> </div> </div>

Labels:

Comments

Post a Comment

Popular posts from this blog

HOW TO CREATE COPY BUTTON WITH HTML, CSS AND JS LANGUAGE

                                                                                                                                                      STRUCTURE WITH  <HTML> <! DOCTYPE html > < html lang = " en " > < head > < meta charset = " utf-8 " /> < meta name = " viewport " content = " width=device-width, initial-scale=1 " /> < link rel = " icon " href = " data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text...
Post a Comment
Read more

HOW TO CREATE A REGISTRATION FORM WITH < HYPER TEXT MARKUP LANGUAGE >

                                                                          CODES <HTML>   <! DOCTYPE html > < html lang = "en" >   < head >     < meta charset = "utf-8" />     < meta name = "viewport" content = "width=device-width, initial-scale=1" />     < link       rel = "icon"       href = "data:image/svg+xml, < svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22> < text y=%22.9em%22 font-size=%2290%22>🎉 < /text> < /svg>"     />     < title > How to access contacts from the address book </ title >   </ head >   < body >     < h1 > How to acc...
Post a Comment
Read more

HOW TO CREATE BUTTONS WITH HTML AND CSS

  CUSTOM BUTTON WITH HTML < section > < h2 > 9 button types </ h2 > < p > Unified modern style, visual differences reinforce purpose. </ p > </ section > < button > Default </ button > < input type = " button " value = " <input> " /> < button > < svg viewBox = " 0 0 24 24 " stroke = " currentColor " width = " 24 " height = " 24 " aria-hidden = " true " > < path d = " M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z " /> </ svg > Icon </ button > < button type = " submit " > Submit </ button > < button type = " button " > Type Button </ button > < button type = " reset " > Reset </ button > < button disabled > Disabled </ button > < button class ...
Post a Comment
Read more