basti1012.bplaced.net

basti1012 kannst Du mir bitte zeigen, wie ich möglichst einfach den Inhalt von einer Box bei hover in einem pop-up Fenster vergrössert darstellen kann. Auf der jetzt vorhandenen Seite hat es

Code

                                    
                                <style>
  *{
  margin:0;
  padding:0;
}
main{
  display:flex;
  flex-direction:column;
}
nav{
  display:flex;
}
.box{
  height:48vh;
  width:48vw;
  border:1px solid red;
   transition:all 1s;
}
.box:hover{
  text-align:center;
  font-size:400%;
}
#go1:hover{
  transform:scale(2) translate(25%,25%);
 transition:all 1s;
  background:red;
}
#go2:hover{
  transform:scale(2) translate(-25%,25%);
 transition:all 1s;
  background:blue;
} 
#go3:hover{
  transform:scale(2) translate(25%,-25%);
 transition:all 1s;
  background:yellow;
} 
#go4:hover{
  transform:scale(2) translate(-25%,-25%);
 transition:all 1s;
  background:green;
 
} 



</style>
<main>
<nav>
<div id="go1" class="box">Zoom</div>
<div id="go2" class="box">Zoom</div>
  </nav>
  <nav>
<div id="go3" class="box">Zoom</div>
<div id="go4" class="box">Zoom</div>
  </nav>
</main>