[ERLEDIGT] Radio Zoom-Menu

[rantanplan2000]

Moin!

wieso ist trotz z-index mein unput nach dem zoom unter dem image?

<div class="container">
<div class="zoom">

<input id="zoomin" type="radio" name="bilderzoom">
<label class="zoomin-label" for="zoomin">Zoom +</label>
<input class="zoomout-label" id="zoomout" type="radio" name="bilderzoom">
<label for="zoomout">Zoom -</label>

<div class="ttt">
<img src="//www.apple.com/pr/products/images/MBP13_PFOP_Mavericks_131021_HERO.jpg" alt="">
</div>

</div>
</div>

#zoomin:checked ~ .ttt img  {
    transform: scale(1.5);
}

#zoomout:checked ~ .ttt img  {
    transform: scale(1);
}

.zoom {
  border: 3px solid #ccc;
  display: block;
  width: 300px;
  height: 280px;
  position: relative;
  display: block;
  overflow: hidden;
  }

.zoomin-label {
  position: absolute:
  top: 0;
  right: 0;
  z-index: 999;
}

.zoom img {
  -webkit-transition: all 1.5s ease;
  transition: all 1.5s ease;
  display: block;
  width: 100%;
  z-index: 1;
}

 

[rantanplan2000]

ahhhh, vielen dank! dusseliger fehler, sorry für die arbeit und danke!

Darf ich nochmal was fragen, diesmal habe ich glaube ich keinen tippfehler :)

Hier der Code:
https://jsfiddle.net/rantanplan2000/jskn93qj/16/

Wieso speichert es nicht die checked Eingabe bei den zwei verschiedenen Inputs-duos nicht?
Ich habe ja einmal zoom in und einmal zoom out, welche jeweils den gleichen input namen haben. das gleiche für move left und move right, auch den gleichen, aber anderen namen.

ich wollte eigentlich erst zoomen und dann eben links und rechts schieben. irgendwas stimmt aber nicht.

ich dachte, wenn inputs den selben namen haben, bleiben diese so lange "checked" bis man ein anderes, mit dem gleichen namen aktiviert?

 

[rantanplan2000]

ah okay, na da kommt man wirklich nicht so leicht drauf. :-) danke nochmal!