Html, CSS, slide up effekt problem

Hallo, ich habe einen html Code für eine slide-up Animation gefunden. Nun funktioniert dieser leider nicht bei Tabletts oder Handys was muss ich bei meinem Code ändern damit es funktioniert ? Ich bin noch ziemlicher Anfänger und ich freue mich über jede Antwort.

Der hier verwendete Code

<html> <div class="boxen"> hallo <div class="hid-boxen"> <h1>Lektion1 Vokabel1</h1> <p>This is a quick demo of slide-up effect using CSS animation when hover the box. No JS required!</p> </div> </div> <style> h1 { margin: 0 } .boxen { height: 210px; width: 310px; overflow: hidden; border: 1px solid black; background: #F2F2F2; } .hid-boxen { top: 100%; position: relative; transition: all .6s ease-out; background: #D6DBE9; height: 100%; margin-top:5%; border:1px solid black ; } .boxen:hover > .hid-boxen{ top: 0; } .boxen:active > .hid-boxen{ top:0; } </style> </html>

Add Comment

* Required information
1000
Drag & drop images (max 3)
Powered by Commentics

Comments

No comments yet. Be the first!