HF/Chapters: Difference between revisions

From Illustrations in German Translations of Mark Twain's Works

No edit summary
Tag: Reverted
Undo revision 1772 by HMHTEST (talk)
Tag: Undo
Line 6: Line 6:
<html>
<html>
<p> Pick a Chapter (1–43):
<p> Pick a Chapter (1–43):
<input type="number" id="chapterInput" min="1" max="43" style="width: 50px; display: inline-block; margin-left: 5px;">
<input type="number" id="chapterInput" min="1" max="43"style="width: 50px; display: inline-block; margin-left: 5px;">
<button onclick="loadSlideshowsByChapter()">Display</button>
<button onclick="loadSlideshowsByChapter()">Display</button>
</p>
</p>
Line 15: Line 15:
     <h3>Kemble</h3>
     <h3>Kemble</h3>
     <img id="slide-Kemble" src="" alt="">
     <img id="slide-Kemble" src="" alt="">
    <div class="mediainfo-box" id="mediainfo-Kemble"></div>
     <div>
     <div>
       <button onclick="prevSlide('Kemble')">←</button>
       <button onclick="prevSlide('Kemble')">←</button>
Line 26: Line 25:
     <h3>Schroedter</h3>
     <h3>Schroedter</h3>
     <img id="slide-Schroedter" src="" alt="">
     <img id="slide-Schroedter" src="" alt="">
    <div class="mediainfo-box" id="mediainfo-Schroedter"></div>
     <div>
     <div>
       <button onclick="prevSlide('Schroedter')">←</button>
       <button onclick="prevSlide('Schroedter')">←</button>
Line 37: Line 35:
     <h3>Hirth</h3>
     <h3>Hirth</h3>
     <img id="slide-Hirth" src="" alt="">
     <img id="slide-Hirth" src="" alt="">
    <div class="mediainfo-box" id="mediainfo-Hirth"></div>
     <div>
     <div>
       <button onclick="prevSlide('Hirth')">←</button>
       <button onclick="prevSlide('Hirth')">←</button>
Line 48: Line 45:
     <h3>Busoni</h3>
     <h3>Busoni</h3>
     <img id="slide-Busoni" src="" alt="">
     <img id="slide-Busoni" src="" alt="">
    <div class="mediainfo-box" id="mediainfo-Busoni"></div>
     <div>
     <div>
       <button onclick="prevSlide('Busoni')">←</button>
       <button onclick="prevSlide('Busoni')">←</button>
Line 59: Line 55:
     <h3>Kellerer</h3>
     <h3>Kellerer</h3>
     <img id="slide-Kellerer" src="" alt="">
     <img id="slide-Kellerer" src="" alt="">
    <div class="mediainfo-box" id="mediainfo-Kellerer"></div>
     <div>
     <div>
       <button onclick="prevSlide('Kellerer')">←</button>
       <button onclick="prevSlide('Kellerer')">←</button>
Line 70: Line 65:
     <h3>Harder</h3>
     <h3>Harder</h3>
     <img id="slide-Harder" src="" alt="">
     <img id="slide-Harder" src="" alt="">
    <div class="mediainfo-box" id="mediainfo-Harder"></div>
     <div>
     <div>
       <button onclick="prevSlide('Harder')">←</button>
       <button onclick="prevSlide('Harder')">←</button>
Line 81: Line 75:
     <h3>Trier</h3>
     <h3>Trier</h3>
     <img id="slide-Trier" src="" alt="">
     <img id="slide-Trier" src="" alt="">
    <div class="mediainfo-box" id="mediainfo-Trier"></div>
     <div>
     <div>
       <button onclick="prevSlide('Trier')">←</button>
       <button onclick="prevSlide('Trier')">←</button>
Line 92: Line 85:
     <h3>Bebié</h3>
     <h3>Bebié</h3>
     <img id="slide-Bebié" src="" alt="">
     <img id="slide-Bebié" src="" alt="">
    <div class="mediainfo-box" id="mediainfo-Bebié"></div>
     <div>
     <div>
       <button onclick="prevSlide('Bebié')">←</button>
       <button onclick="prevSlide('Bebié')">←</button>
Line 112: Line 104:
   border: 1px solid #ccc;
   border: 1px solid #ccc;
   padding: 10px;
   padding: 10px;
  position: relative; /* Für MediaInfo-Box Positionierung */
}
}
.slideshow-box img {
.slideshow-box img {
   max-width: 100%;
   max-width: 100%;
   height: auto;
   height: auto;
  cursor: pointer;
}
}
.slide-counter {
.slide-counter {
Line 123: Line 113:
   font-size: 0.9em;
   font-size: 0.9em;
   color: #555;
   color: #555;
}
.mediainfo-box {
  display: none;
  position: absolute;
  top: 5px;
  left: 5px;
  background: rgba(255,255,255,0.95);
  border: 1px solid #ccc;
  padding: 0.5em 1em;
  border-radius: 4px;
  font-size: 0.9em;
  z-index: 10;
  max-width: 90%;
  text-align: left;
}
.slideshow-box img:hover + .mediainfo-box {
  display: block;
}
}


Line 148: Line 121:
}
}
</style>
</style>





Revision as of 15:10, 16 September 2025



Compare illustrators one by one

Pick a Chapter (1–43):

Kemble

0/0

Schroedter

0/0

Hirth

0/0

Busoni

0/0

Kellerer

0/0

Harder

0/0

Trier

0/0

Bebié

0/0