JS
innerHTML vs textContent (html tags are not parsed)
setInterval
(function(){
'use strict';
document.addEventListener('DOMContentLoaded', function(){
var currentTime = document.getElementById('current-time'),
currentDate = document.getElementById('current-date');
setInterval(function() {
var d = new Date();
var hours = d.getHours(),
minutes = d.getMinutes(),
month = formatMonth(d.getMonth()),
date = d.getDate(),
ampm = 'AM';
if (hours > 12) {
hours -= 12;
ampm = 'PM';
} else if (hours === 0) {
hours = 12;
}
if (minutes < 10) {
minutes = '0' + minutes;
}
var sepClass = '';
if (d.getSeconds() % 2 === 1) sepClass = 'trans';
var sep = '<span class="' + sepClass + '">:</span>';
currentTime.innerHTML = hours + sep + minutes + ' ' + ampm;
currentDate.textContent = month + ' ' + date;
}, 1000);
function formatMonth(m) {
m = parseInt(m, 10);
if (m < 0) {
m = 0;
} else if (m > 11) {
m = 11;
}
/*
var monthName;
switch(m) {
case 0 :
monthName = "January";
break;
case 1 :
monthName = "February";
break;
// and so on...
}
*/
var monthNames = [
'January', 'February', 'March',
'April', 'May', 'June',
'July', 'August', 'September',
'October', 'November', 'December'
];
return monthNames[m];
}
});
})();
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Landon Hotel</title>
<link rel="stylesheet" href="../../landonhotel.com/css/style.css">
<link rel="stylesheet" href="../../landonhotel.com/css/extras.css">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
</head>
<body>
<header id="intro">
<article class="fullheight">
<div class="hgroup">
<h1>Landon Hotel</h1>
<h2>West London</h2>
<p><a href="#welcome"><img src="../../landonhotel.com/images/misc/arrow.png" alt="down arrow"></a></p>
</div>
</article>
<nav id="nav">
<div class="navbar">
<div class="brand"><a href="#welcome">Landon <span>Hotel</span></a></div>
<ul>
<li><a class="icon info" href="#hotelinfo"><span>info</span></a></li>
<li><a class="icon rooms" href="#rooms"><span>rooms</span></a></li>
<li><a class="icon dining" href="#dining"><span>dining</span></a></li>
<li><a class="icon events" href="#events"><span>events</span></a></li>
<li><a class="icon attractions" href="#attractions"><span>attractions</span></a></li>
</ul>
</div><!-- navbar -->
</nav>
</header>
<main id="wrapper">
<div class="scene" id="welcome">
<article class="content">
<div class="gallery">
<img src="../../landonhotel.com/images/hotel/intro_room.jpg" alt="Intro Gallery Room Sample Pictures">
<img src="../../landonhotel.com/images/hotel/intro_pool.jpg" alt="Intro Gallery Pool Sample Pictures">
<img src="../../landonhotel.com/images/hotel/intro_dining.jpg" alt="Intro Gallery Dining Sample Pictures">
<img src="../../landonhotel.com/images/hotel/intro_attractions.jpg" alt="Intro Gallery Attractions Sample Pictures">
<img class="hidesm" src="../../landonhotel.com/images/hotel/intro_wedding.jpg" alt="Intro Gallery Dining Sample Pictures">
</div>
<h1>Welcome to the Landon Hotel</h1>
<p>The original Landon perseveres after 50 years in the heart of West London. The West End neighborhood has something for everyone—from theater to dining to historic sights. And the not-to-miss Rooftop Cafe is a great place for travelers and locals to engage over drinks, food, and good conversation. To learn more about the Landon Hotel in the West End, browse our website and <a href="../../landonhotel.com/files/landon_information_sheet_London.pdf">download our handy information sheet</a>.</p>
</article>
</div><!-- welcome -->
<div class="scene" id="hotelinfo">
<article class="heading">
<h1>Essential Info</h1>
</article>
<article id="usefulinfo">
<section id="arrivalinfo">
<h2>Arrival Information</h2>
<ul>
<li><strong>Check-in:</strong> 3:00 PM</li>
<li><strong>Check-out:</strong> 11:00 AM</li>
<li><strong>Parking:</strong> Self-parking in the underground garage is ￡15 per day and valet-parking is ￡50 per day.</li>
<li><strong>Airport Shuttle:</strong> Our complimentary airport shuttles leave every hour on the hour, and make trips to Heathrow and Gatwick airports.</li>
<li><strong>Trains:</strong> The nearest Underground station is at Leicester Square.</li>
<li><strong>Pet Policy:</strong> Pets of all sizes and types are allowed in designated pet rooms, and the specified common areas. Service animals are allowed everywhere.</li>
</ul>
</section>
<section class="checklist" id="services">
<h2>Services and Amenities</h2>
<p>Our services and amenities are designed to make your travel easy, your stay comfortable, and your experience one-of-a-kind.</p>
<ul>
<li>Indoor pool</li>
<li>24-hour fitness center</li>
<li>Massage therapy</li>
<li>Full service spa</li>
<li>In-room jacuzzi tubs</li>
<li>Rooftop café & smoothie bar</li>
<li>Coffee bar & pastry shop</li>
<li>Traditional continental breakfast</li>
<li>24-hour concierge service</li>
<li>Business center</li>
<li>Complimentary wireless service</li>
<li>Laundry & dry cleaning service</li>
<li>Daily paper</li>
<li>Certified "green" hotel</li>
<li>Pet-friendly rooms & common areas</li>
</ul>
</section>
<section class="checklist" id="accessibility">
<h2>Accessibility</h2>
<p>We're committed to maintaining the same quality of service for every individual. We offer the following facilities for those with special needs:</p>
<ul>
<li>Grab bars on tub walls</li>
<li>Shower chairs</li>
<li>Hand held shower sprayers</li>
<li>Higher toilets & toilet modifiers</li>
<li>Lower sink faucet handles</li>
<li>Wheelchair clearance under sinks & vanity</li>
<li>Lower racks in closet</li>
<li>TDD machines</li>
<li>Telephone light signalers & smoke alarms</li>
<li>Telephone amplification handsets</li>
<li>Closed captioned television converters</li>
<li>Vibrating alarm clocks</li>
<li>Telephones with volume control</li>
</ul>
</section>
</article>
<article id="greenprogram">
<h2>Landon Green Program</h2>
<p><strong>The Landon Hotel - London</strong> was recently renovated, and we considered the impact on the earth the entire way. From green building materials, to solar power, to energy-friendly lighting and appliances throughout the hotel - we’re saving energy in every socket, outlet, and switch. We’ve also initiated a recycling and composting program that reduces the load to local landfills, while providing valuable raw material for use in new products, or in the case of compost, for use in local gardens and landscapes.</p>
</article>
</div><!-- hotelinfo -->
<div class="scene" id="rooms">
<header>
<h1>Guest Rooms</h1>
<p>Our guest rooms feature sumptuous classic furnishings that evoke visions of London’s rich and long-standing tradition of royalty. While our rooms are decked out in classic design, they each have a modern flair, and contain all the modern comforts expected in today’s luxury hotels. We’ve named our rooms for the notable public squares and circuses around which the West End is laid out.</p>
</header>
<article class="room fullheight" id="piccadilly">
<section class="content">
<h1>Piccadilly</h1>
<p>Designed to be our economy room, for those who will be spending more time seeing the sights, and less time hitting the hay. The Piccadilly room has a smaller footprint, but maintains the accommodations of some of our more deluxe rooms.</p>
</section>
</article>
<article class="room fullheight" id="cambridge">
<section class="content">
<h1>Cambridge</h1>
<p>This room features a king bed, with a Comfort-Plus mattress, covered in 400-thread Egyptian cotton sheets. The Cambridge room is decorated in tasteful and warm muted tones, that are soothing on the eyes and senses.</p>
</section>
</article>
<article class="room fullheight" id="westminster">
<section class="content">
<h1>Westminster</h1>
<p>This room is available with a king or two double beds, and is furnished with our Premiere London collection – the softest and most luxurious bed and bath linens.</p>
</section>
</article>
<article class="room fullheight" id="oxford">
<section class="content">
<h1>Oxford</h1>
<p>Our Oxford suites are some of the prettiest and most romantic rooms around and are perfect for honeymoons. All of these feature canopy beds, lots of windows, and spare no modern comfort or convenience, including a TLX media system.</p>
</section>
</article>
<article class="room fullheight" id="victoria">
<section class="content">
<h1>Victoria</h1>
<p>Traveling with the family? Our spacious Victoria suites, with breathtaking views of the city, are the perfect choice. These corner rooms are furnished with a king or two double beds, and have a sofa with a comfortable pullout bed.</p>
</section>
</article>
<article class="room fullheight" id="manchester">
<section class="content">
<h1>Manchester</h1>
<p>The Manchester Executive Suite, is popular with business travelers the world over. These two-room suites feature a king-size bed, living room with leather recliner, full-sized executive desk, and leather desk chair.</p>
</section>
</article>
</div><!-- rooms -->
<div class="scene" id="dining">
<article id="areadining">
<h1>Dining in the Area</h1>
<p>The West End is a foodie’s paradise, and the Landon Hotel is in the center of it all. With options for traditional English, Italian, Indian, American, Chinese, and French cuisines, all within two blocks of the hotel, and a variety of tasty culinary delights from many other countries, within a half-mile radius, the only trouble you’ll have is choosing! </p>
</article>
<article id="inhotel">
<section id="rooftopcafe">
<h2>Rooftop Café</h2>
<img src="../../landonhotel.com/images/hotel/dining_rooftop.jpg" alt="Dining">
<p>Landon Rooftop Café is the destination for five star dining. Our master chefs are trained to meet special dietary needs, and we offer a range of vegetarian/vegan, kosher, gluten, and dairy free selections to accommodate our guests. Whether you’re in the mood for our award winning roast beef, fresh select salads, appetizing lunch entrees, or delectable desserts, we have you covered.</p>
</section>
<section id="smoothiebar">
<h2>Smoothie Bar</h2>
<img src="../../landonhotel.com/images/hotel/dining_smoothiebar.jpg" alt="Dining">
<p>The Rooftop Smoothie Bar gives you panoramic views of the city, where you can have one of our specialty smoothies while you wait for your table. Our top mixologists are constantly bringing new and unique offerings to our smoothie menu. We have a wide range of locally grown, fresh fruit and vegetable choices to make you custom blended drinks. We also have seasonal selections that you won’t find anywhere else.</p>
</section>
<section id="coffeebar">
<h2>Breakfast & Coffee Bar</h2>
<img src="../../landonhotel.com/images/hotel/dining_lattes.jpg" alt="Dining">
<p>Our traditional breakfast and coffee bar, located adjacent to our lounge, are the perfect way to start your morning. We offer a wide selection of seasonal fresh fruit, a variety of cereals, croissants, crusty sourdough bread, cook-to-order eggs and omelettes, fresh juice, coffee, and teas. Breakfast is served from 7:00 am to 10:00 am daily. Our coffee bar is open until 6:30 pm daily.</p>
</section>
</article><!-- inhotel -->
<article id="roomservice">
<h1>Room Service</h1>
<p>If you’d rather stay in your room and enjoy a quiet evening in, or a relaxing breakfast in bed, room service options are available for all of our dining choices.</p>
</article>
</div><!-- dining -->
<div class="scene" id="events">
<article class="event fullheight" id="businessmeetings">
<div class="content">
<h2>Upcoming Events</h2>
<ul id="event-list">
<li>
<span class="date">May 23</span><br>
7:00 PM<br>
Happy hour in the lobby
</li>
<li>
<span class="date">June 16</span><br>
12:00 - 3:00 PM<br>
National Honor Society Year-End Gala
</li>
<li>
<span class="date">July 4</span><br>
10:00 AM - 8:00 PM<br>
Independence Day Festival
</li>
<li>
<span class="date">July 19</span><br>
2:00 - 6:00 PM<br>
Champagne Valley Wine Tasting
</li>
</ul>
<div id="clock">
<div class="label">Now</div>
<div id="current-date"></div>
<div id="current-time"></div>
</div>
</div><!-- content -->
</article><!-- article -->
</div><!-- events -->
<div class="scene fullheight" id="attractions">
<article class="content">
<h1>Local Attractions</h1>
<p>Whether you’re a theater enthusiast, enjoy epic shopping, or love to stroll and people watch, London’s West End has an endless opportunity to partake. The heart of London’s "Theatreland" offering the best in drama, comedy, and musical productions.</p>
</article>
</div><!-- attractions -->
</main>
<footer class="scene">
<article class="content">
<div id="socialmedia">
<ul class="group">
<li><a href="https://twitter.com/"><img class="icon" src="../../landonhotel.com/images/socialmedia/twitter.png" alt="icon for twitter" /></a></li>
<li><a href="http://www.facebook.com/"><img class="icon" src="../../landonhotel.com/images/socialmedia/facebook.png" alt="icon for facebook" /></a></li>
<li><a href="http://www.youtube.com/"><img class="icon" src="../../landonhotel.com/images/socialmedia/youtube.png" alt="icon for youtube" /></a></li>
</ul>
</div>
</article>
</footer>
<script src="../../landonhotel.com/js/script.js"></script>
<script src="script.js"></script>
</body>
</html>
扫一扫
3484
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
