Question

In: Computer Science

2. HTML/CSS/JavaScript Under 'project’ create a subdirectory titled ‘travelsite’. Create a slide show for a travel...

2. HTML/CSS/JavaScript

Under 'project’ create a subdirectory titled ‘travelsite’.

Create a slide show for a travel and tourism company. Use between 8 and 12 pictures that will automatically change every 1 to 3 seconds. You may use the pictures from Assignment 1 and add more to the collection. The slide show will have the following features:

  • Use a background image.
  • The pictures must use a type of ‘transition’ ie Fade in/Fade out when the pictures change.
  • Each picture must include a brief caption describing it.
  • The page will include a ‘header’ that provides the name of the company and a logo. Use the CSS ‘text-shadow’ property on the company name.
  • The page must include a ‘footer’ section with the address and contact information of the company.

Solutions

Expert Solution

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>travelog</title>

<style>

.sldr{display:none;}

</style>
</head>

<body>
   <header>
       <div>
           <div style="float: left">LOGO</div>
           <div style="text-shadow:#cccccc 10px 5px; float: left">Company Name</div>
       </div>
   </header>
   <section>
       <div>
           <div class="fade sldr">
               <img src="" />
               <div>Caption text</div>
           </div>
           <div class="fade sldr">
               <img src="" />
               <div>Caption text</div>
           </div>
           <div class="fade sldr">
               <img src="" />
               <div>Caption text</div>
           </div>
           <div class="fade sldr">
               <img src="" />
               <div>Caption text</div>
           </div>
           <div class="fade sldr">
               <img src="" />
               <div>Caption text</div>
           </div>
           <div class="fade sldr">
               <img src="" />
               <div>Caption text</div>
           </div>
           <div class="fade sldr">
               <img src="" />
               <div>Caption text</div>
           </div>
           <div class="fade sldr">
               <img src="" />
               <div>Caption text</div>
           </div>
       </div>
   </section>
   <footer>
       <div>
           <div>Address:</div>
           <div>Contact us:</div>
       </div>
   </footer>
</body>
</html>


Related Solutions

Project 2c (Javascript/HTML/CSS)– Mouse Chase: Create a page with a nice, shiny, pretty button on it....
Project 2c (Javascript/HTML/CSS)– Mouse Chase: Create a page with a nice, shiny, pretty button on it. The button should say ‘Click to receive $10!’ However, any time the user’s mouse cursor gets over the button, the button should move to a random location on the page, making the button essentially impossible to click! However, if they do somehow manage to click the button, redirect the user to an image of a 10 trillion Zimbabwe Dollar. Finally, the background color of...
Task 1: HTML and CSS Create a website using HTML5 and CSS3 only. Please no JavaScript...
Task 1: HTML and CSS Create a website using HTML5 and CSS3 only. Please no JavaScript or Bootstrap. Website theme can be anything you want: a country, a town, a place, a hobby, people (yourself, your family...), pets, flowers, food, or anything that you find interesting or useful. It may be about real people/places/things or fictitious. Part 1: Content (HTML) After you decide the theme of your website, create HTML pages with the content you want to present. Remember to...
suggests on how to save the web portfolio Programming languages Chosen: HTML, CSS, and JavaScript. Project...
suggests on how to save the web portfolio Programming languages Chosen: HTML, CSS, and JavaScript. Project Name: Auto Portfolio Project Goal: Create a website that will generate a web portfolio using information inputted by the user. Product Backlog using user stories: As a user, I want to be able to save my web portfolio in a format which I can save so I can use the website later for my own needs. Example: http://www-personal.umich.edu/~hamatilo/
suggests on how to save the web portfolio Programming languages Chosen: HTML, CSS, and JavaScript. Project...
suggests on how to save the web portfolio Programming languages Chosen: HTML, CSS, and JavaScript. Project Name: Auto Portfolio Project Goal: Create a website that will generate a web portfolio using information inputted by the user. Product Backlog using user stories: As a user, I want to be able to save my web portfolio in a format which I can save so I can use the website later for my own needs.
Develop a personal web page for yourself using HTML, CSS, and Javascript Use the following HTML...
Develop a personal web page for yourself using HTML, CSS, and Javascript Use the following HTML tags to design your webpage: <h1>...</h1>,<h3>...</h3>, <h6>...</h6>, <p>...</p>, <b>...</b>, <i>...</i>, <a>...</a>, <img...>, <table>... </table>, <div>...</div>, <form>...</form>, <input type="text">, and <input type= "submit"> Use an external css to change the default style of your webpage. You must use at least one element selector, one id selector, and one class selector Using text input and submit button, allow the user to change the background color of...
Build an application using HTML, CSS, javascript, json. It is not necessary for backend to be...
Build an application using HTML, CSS, javascript, json. It is not necessary for backend to be working but the frontend should be good. App should to simple and useful in our day to day life. For eg- grocery shopping list or alarm or weather forecast or reminder.
Make sure it works on jsfiddle and keep the code seperate html: css: javascript: -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------
Make sure it works on jsfiddle and keep the code seperate html: css: javascript: ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- Assignment You should already have some experience with jQuery and some simple experience with JSON (from charting). In this assignment we will be creating some JSON data, parsing it, and displaying it. Step 1 – If you are not familiar with JSON you should complete the JSON tutorial at w3schools Step 2- You will now create a JSON file to represent some data of your...
Build a html form (making use of CSS and Javascript) with the following elements. The form...
Build a html form (making use of CSS and Javascript) with the following elements. The form must have validations and within a table format. • Name: a text box where the content must start with 1 upper case characters and no special character (i.e. !, @, #, $, %, &, *). Number is not allowed. The text box must not be empty. • Module code: a text box where the content must start with 3 lower case alphabets and follows...
Create a footer for web page using HTML,CSS,Javascript. The footer should contain 1.Back to top button...
Create a footer for web page using HTML,CSS,Javascript. The footer should contain 1.Back to top button 2.Random logo 3.Copyright content
HTML/CSS/JavaScript Create a page that converts 4 different measurements (i.e. length, volume, area, distance) to either...
HTML/CSS/JavaScript Create a page that converts 4 different measurements (i.e. length, volume, area, distance) to either Imperial or Metric values. When a value is entered into one of the fields, the converted amount is displayed in the other corresponding field. Example: Converting between litres and gallons. If you enter 25 for gallons, the value of 113.50 litres should be displayed. Converting between gallons and litres. If you enter 75 litres, the value of 16.52 gallons should be displayed. (Note, 1...
ADVERTISEMENT
ADVERTISEMENT
ADVERTISEMENT