This forum uses cookies
This forum makes use of cookies to store your login information if you are registered, and your last visit if you are not. Cookies are small text documents stored on your computer; the cookies set by this forum can only be used on this website and pose no security risk. Cookies on this forum also track the specific topics you have read and when you last read them. Please confirm whether you accept or reject these cookies being set.

A cookie will be stored in your browser regardless of choice to prevent you being asked this question again. You will be able to change your cookie settings at any time using the link in the footer.

Themabewertung:
  • 0 Bewertung(en) - 0 im Durchschnitt
  • 1
  • 2
  • 3
  • 4
  • 5
hover
#1
Hey!

Folgendes möchte ich umsetzen:
Ich möchtedas ganze so haben: http://prntscr.com/jwdnrt - Wenn ich mit der Maus über das Bild gehe soll das Bild wechseln, ca. so: http://prntscr.com/jwdo46

Das geht auch soweit sehr gut, ich habe es bis jetzt so umgesetzt:

    <style>


                          .Instaaagran {
                              width: 50px;
                              height: 50px;
                              background-size: 50px;
                              background: url(media/nice/colored/Instagram.png) no-repeat;
                              transition: 2.0s;
                             
                            }


                         .Instaaagran:hover {
                             background: url(media/nice/Instagram.png)
                                 no-repeat;
                                 background-size: 50px; }

                                           .TWIIII {
                                            width: 50px;
                                            height: 50px;
                                            background-size: 50px;
                             
                                               background: url(media/nice/colored/Twitter.png) no-repeat;
                                               transition: 2.0s;
                                                                          width: 50px;
                              height: 50px;
                              background-size: 50px; }


                                          .TWIIII:hover {
                                              background: url(media/nice/Twitter.png)
                                                  no-repeat;
                                                  background-size: 50px; }


                                                  .YYYTT {
                                                    width: 50px;
                                                    height: 50px;
                                                    background-size: 50px;
                             
                                                      background: url(media/nice/colored/YouTube.png) no-repeat;
                                                      transition: 2.0s; }


                                                 .YYYTT:hover {
                                                     background: url(media/nice/YouTube.png)
                                                         no-repeat;
                                                         background-size: 50px; }


.flex-container {
  display: flex;
  justify-content: center;
  background-color: none;
    height: 10px;
}

.flex-container > div {
  width: 128px;
  margin: 10px;
  text-align: center;
  line-height: 100px;
  font-size: 30px;
   background-size: 50px;
}
</style>


<div class="obergeordneterflex">


    <div class="flex-container">
        <div class="Instaaagran"></div>
  <div class="TWIIII" href="http://twitter.com/playgalaxy_net"></div>
  <div class="YYYTT" href="http://youtube.com"></div>  
    </div>
  </div>


Jedoch habe ich keine Ahnung wie ich das ganze jetzt verlinken soll, dass wenn ich auf das Bild klicke ein Link sich öffnet. Wenn ich den Tag nutze verschiebt sich das Bild. Sad

Viele Grüße
Jakob
Zitieren
#2
Ist das alles an Code ? Gib mir mal die Link zu den Bilder ? Wir hatten das doch schon fertig du brauchtest doch nur bider ändern und verlinken. Naja gib mal links zu den Bildern und sag mal was passieren soll wenn man die Bilder hovert
Als Lösung markieren Zitieren
#3
Hier das wahr es doch https://basti1012.bplaced.net/index.php?ordner=soforthilfeforum&name=Hover und verlinkt wahren die doch auch . Was bekommst du den jetzt nicht hin?
Als Lösung markieren Zitieren
#4
Also wenn ich die Frage richtig verstehe meint Jakob eher, dass man jetzt bei klick auf sein Bild auf eine Website geleitet wird. Das machst du dann schon mit einem Befehl, jedoch schließt du das erst nachdem du zwischen rein dein gemacht hast.

Z.B.:


<a href="https://www.google.com">
<img src="deinBild.png">
</a>

Falls du nicht das meinst, sorry, wollte nur auch mal versuchen zu helfen. Big Grin
Als Lösung markieren Zitieren


Gehe zu:


Benutzer, die gerade dieses Thema anschauen: 1 Gast/Gäste