Ergebnis 1 bis 3 von 3
Like Tree1Likes
  • 1 Post By Karli1969

Thema: Image zoom: Border zoomt ungewollt mit

  1. #1
    Karli1969 ist offline Mitglied
    registriert
    14-03-2015
    Beiträge
    27

    Image zoom: Border zoomt ungewollt mit

    Hallo zusammen,

    wenn ich ein Bild vergrößert darstellen will, dann kann ich das ja unter anderem mit folgendem CSS machen:

    Code:
       img.zoom {
                 transition: transform 0.8s;
                 -moz-transition: transform 0.8s;
                 -webkit-transition: transform 0.8s;
                 -o-transition: transform 0.8s;
                 -ms-transition: transform 0.8s;
            }
                img.zoom:hover {
    
                 cursor: zoom-in;
                 cursor: -moz-zoom-in;
                 cursor: -webkit-zoom-in;
                 transform: scale(4.0, 4.0) translate(-35px);
                 -moz-transform: scale(4.0, 4.0) translate(-35px);
                 -webkit-transform: scale(4.0, 4.0) translate(-35px);
                 -o-transform: scale(4.0, 4.0) translate(-35px);
                 -ms-transform: scale(4.0, 4.0) translate(-35px);
            }

    Gehe ich mit der Maus über das Bild, wird das Bild um Faktor 4 vergrößert und etwas nach links geschoben dargestellt.
    Das klappt auch wunderbar. Auch ein sehr schöner Effekt, wenn die Transition nicht schlagartig, sondern weich erfolgt.

    Mein Problem: Die Bilder haben in Normaldarstellung einen Rahmen von 1px solid.
    Das sieht schön aus, aber nach dem Vergrößern wird aus dem filigranen Rahmen ein regelrechter Balkenrahmen. Er wird ebenfalls um Faktor 4 dicker. Kann man das irgendwie hinbekommen, dass der Rahmen seine 1px Dicke behält?

    Vielen Dank schon mal
    und
    viele Grüße
    Karl

  2. #2
    Karli1969 ist offline Mitglied
    registriert
    14-03-2015
    Beiträge
    27

    AW: Image zoom: Border zoomt ungewollt mit

    Sieht so aus, als ob es nicht gehen würde. Aber so schlimm ist es nun auch wieder nicht. Falls ich eine Lösung finden oder mir selbst ersinnen sollte, werde ich sie hier posten, für den Fall, dass andere das gleiche Problem haben sollten.
    mikdoe likes this.

  3. #3
    Avatar von mikdoe
    mikdoe ist offline Administrator
    registriert
    01-05-2010
    Beiträge
    7.534

    AW: Image zoom: Border zoomt ungewollt mit

    Hast du dir das hier mal angeschaut? Css-element-queries by marcj
    Das stellt einen "ResizeSensor" bereit. Vielleicht kannst du damit die border size immer wieder auf den gewünschten Wert setzen. Also quasi ein resize Eventhandler für ein Element.
    Das deutsche Javascript Forum http://forum.jswelt.de http://forum.jswelt.de/images/logoJsWeltForumV4_32x22.png
    Sorry wenn ich manchmal ohne Hallo und nur klein schreibe! Dann bin ich nicht unfreundlich sondern mit nervigem kleinem Touch Tablet zugange

Ähnliche Themen

  1. Antworten: 0
    Letzter Beitrag: 04-12-2012, 16:24
  2. Image Zoom via JS
    Von noidea001 im Forum JavaScript
    Antworten: 1
    Letzter Beitrag: 13-04-2010, 03:13
  3. Aufklappbare Menüleiste klappt ungewollt zu
    Von Alice W. im Forum JavaScript
    Antworten: 4
    Letzter Beitrag: 16-02-2009, 20:32
  4. Image Zoom
    Von bullettooth im Forum JavaScript
    Antworten: 2
    Letzter Beitrag: 12-05-2006, 15:20
  5. Apple: Ungewollt 96% Rabatt auf Alben
    Von Freelancer im Forum Smalltalk
    Antworten: 1
    Letzter Beitrag: 29-08-2005, 09:10

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •