Browse Source

new rules for signalisation which room is active in gallery

master
T. Meissner 11 years ago
parent
commit
e09f757a8e
2 changed files with 62 additions and 38 deletions
  1. +17
    -4
      css/style.css
  2. +45
    -34
      wohnung.html

+ 17
- 4
css/style.css View File

@ -35,6 +35,7 @@ span.cursive {
font-size: larger; font-size: larger;
} }
/* page area styles */ /* page area styles */
#wrapper { #wrapper {
@ -59,8 +60,6 @@ span.cursive {
left: 10px; left: 10px;
bottom: 10px; bottom: 10px;
color: #fff; color: #fff;
/*text-shadow: -0.06em -0.06em 0.06em black,
0.04em 0.04em 0.06em white;*/
text-shadow: .05em .05em .05em #000; text-shadow: .05em .05em .05em #000;
} }
@ -148,7 +147,7 @@ span.cursive {
} }
#content #index-img { #content #index-img {
margin 0 auto;
margin: 0 auto;
padding-left: 10px; padding-left: 10px;
} }
@ -185,10 +184,24 @@ span.cursive {
#content #content-right ul { #content #content-right ul {
padding-left: 1em; padding-left: 1em;
margin: 0.5em 0;
margin: 0.4em 0;
list-style-type: square; list-style-type: square;
} }
#content-right div {
margin-top: 1em;
}
#content-right div h3 {
padding-top: 0;
}
#content-right div.active {
background-color: #eee;
border: solid 0px #eee;
box-shadow: 0px 0px 6px 2px #eee;
}
#img-gallery { #img-gallery {
float: left; float: left;
width: 540px; width: 540px;


+ 45
- 34
wohnung.html View File

@ -44,28 +44,28 @@
</p> </p>
<div id="img-gallery"> <div id="img-gallery">
<img id="gallery-big" src="images/wohnung1.jpg" alt="" width="530" height="398"> <img id="gallery-big" src="images/wohnung1.jpg" alt="" width="530" height="398">
<a id="wohnung0"><img class="gallery-small gallery-left" src="images/wohnung1.jpg" alt="" width="125" height="100">
<a id="wohnung0"><img class="gallery-small gallery-left kueche-img" src="images/wohnung1.jpg" alt="" width="125" height="100">
<span></span> <span></span>
</a> </a>
<a id="wohnung1"><img class="gallery-small" src="images/wohnung2.jpg" alt="" width="125" height="100">
<a id="wohnung1"><img class="gallery-small kueche-img" src="images/wohnung2.jpg" alt="" width="125" height="100">
<span></span> <span></span>
</a> </a>
<a id="wohnung2"><img class="gallery-small" src="images/wohnung3.jpg" alt="" width="125" height="100">
<a id="wohnung2"><img class="gallery-small wohnung-img" src="images/wohnung3.jpg" alt="" width="125" height="100">
<span></span> <span></span>
</a> </a>
<a id="wohnung3"><img class="gallery-small" src="images/wohnung4.jpg" alt="" width="125" height="100">
<a id="wohnung3"><img class="gallery-small wohnung-img" src="images/wohnung4.jpg" alt="" width="125" height="100">
<span></span> <span></span>
</a> </a>
<a id="wohnung4"><img class="gallery-small gallery-left" src="images/wohnung5.jpg" alt="" width="125" height="100">
<a id="wohnung4"><img class="gallery-small gallery-left wohnung-img" src="images/wohnung5.jpg" alt="" width="125" height="100">
<span></span> <span></span>
</a> </a>
<a id="wohnung5"><img class="gallery-small" src="images/wohnung6.jpg" alt="" width="125" height="100">
<a id="wohnung5"><img class="gallery-small bad-img" src="images/wohnung6.jpg" alt="" width="125" height="100">
<span></span> <span></span>
</a> </a>
<a id="wohnung6"><img class="gallery-small" src="images/wohnung7.jpg" alt="" width="125" height="100">
<a id="wohnung6"><img class="gallery-small bad-img" src="images/wohnung7.jpg" alt="" width="125" height="100">
<span></span> <span></span>
</a> </a>
<a id="wohnung7"><img class="gallery-small" src="images/wohnung8.jpg" alt="" width="125" height="100">
<a id="wohnung7"><img class="gallery-small bad-img" src="images/wohnung8.jpg" alt="" width="125" height="100">
<span></span> <span></span>
</a> </a>
</div> </div>
@ -78,33 +78,41 @@
<p> <p>
Sie befindet sich im 1. OG unseres Hauses und eignet sich für bis zu 3 Personen (plus einem Kleinkind). Sie befindet sich im 1. OG unseres Hauses und eignet sich für bis zu 3 Personen (plus einem Kleinkind).
</p> </p>
<div id="kueche">
<h3>Küche</h3> <h3>Küche</h3>
<ul>
<li>Einbauküche</li>
<li>Herd, Kühlschrank, Toaster</li>
<li>Kaffeemaschine, Wasserkocher</li>
<li>Sitzecke zum Verweilen</li>
</ul>
<h3>Wohn- & Schlafzimmer</h3>
<ul>
<li>Doppelbett, Schlafsofa</li>
<li>Stubentisch mit Sitzen</li>
<li>Kommoden zum Verstauen</li>
<li>LCD-Fernseher, Musikanlage</li>
</ul>
<h3>Bad & Flur</h3>
<ul>
<li>Dusche</li>
<li>beleuchteter Badspiegel</li>
<li>Kleider- & Schuhschrank</li>
<li>Garderobe mit Spiegel</li>
</ul>
<h3>Allgemein</h3>
<ul>
<li>Internet über WLAN</li>
<li>PKW-Stellplatz</li>
<li>Garten mit Gartenmöbeln</li>
</ul>
<ul>
<li>Einbauküche</li>
<li>Herd, Kühlschrank, Toaster</li>
<li>Kaffeemaschine, Wasserkocher</li>
<li>Sitzecke zum Verweilen</li>
</ul>
</div>
<div id="wohnung">
<h3>Wohn- & Schlafzimmer</h3>
<ul>
<li>Doppelbett, Schlafsofa</li>
<li>Stubentisch mit Sitzen</li>
<li>Kommoden zum Verstauen</li>
<li>LCD-Fernseher, Musikanlage</li>
</ul>
</div>
<div id="bad">
<h3>Bad & Flur</h3>
<ul>
<li>Dusche</li>
<li>beleuchteter Badspiegel</li>
<li>Kleider- & Schuhschrank</li>
<li>Garderobe mit Spiegel</li>
</ul>
</div>
<div id="allgemein">
<h3>Allgemein</h3>
<ul>
<li>Internet über WLAN</li>
<li>PKW-Stellplatz</li>
<li>Garten mit Gartenmöbeln</li>
</ul>
</div>
</div> </div>
</div> </div>
@ -115,6 +123,9 @@
</div> </div>
<script src="js/classList.min.js"></script>
<script src="js/meissner-wohnen.js"></script>
</body> </body>
</html> </html>

Loading…
Cancel
Save