Beiträge von Chris_BAC

Zitat von gericoach

...spätestens wenn ein Kunde anruft, weil die Seite bei ihm schrottig aussieht und er genötigt wird, seinen Browser zu ändern. Unter XP ist der IE8 das Höchste, was geht. Du solltest da vorsichtig sei, es sind keine Randgruppen sondern oftmals Unternehmen.

Guter Punkt. Hast mich überzeugt.

Danke und schönen Tag.

Zum Thema IE8:

Macht es überhaupt Sinn, Zeit in die Anpassung der Seite zu stecken, damit sie auf einem veralteten browser korrekt dargestellt wird? Nach aktuellen browser-statistiken benutzen 20% aller user IE und davon in Summe nur noch 40% Version 9 oder älter. Ich glaube diese Randgruppe werde ich vernachlässigen und das mit dem WP-browser-update-plugin umgehen.

Oder was sagen erfahrene wp-ler dazu?

Zitat von gericoach

hab mir die seite gerade mit dem IE8 angesehen...irgendwelche Striche dürften Dein kleinstes Problem sein. :)

Wohl war, aber irgendwo muss man ja anfangen. Kann noch irgendjemand mit dem Problem helfen?

Zitat von wpchecker

Also entweder bin ich blind - oder ich sehe da keine Linie o.O

Vielleicht war das die falsche Formulierung. In jedem fall sind die schrägen Lienen gestuft / pixelig.

Zitat von gericoach

Mensch, mach erstmal das Logo kleiner, wenn Du schon in Photoshop rumfummelst!

Upsi, war noch die falsche Datei. Sieht in der kleineren Version leider auch nicht besser aus. :/

IE10

Danke für die Antworten

Hallo Forum,

das Logo( png) links oben wird in sämtlichen browsern richtig dargestellt, abgesehen vom IE. Es macht den Eindruck, als stelle er um die Grenze der Freistellung des Logos noch eine weiße 1-pixel Linie dar.
Ich kann aber die Freistellung im Photoshop nicht weiter nach innen verschieben, da ich mir sonst die feine Schrift wegschneide.
Gibt es dafür einen fix?

http://www.test.bac.ag

Gruß,
Chris

Ok,

.preview:hover + #textbox {}

das geht leider nicht. Werde es jetzt mit einem zusätzlichen div probieren.

Danke für die Hilfe

LG

Zitat von pixselig

Hallo
Entferne mal das Leerzeichen, also

Code

.preview:hover

LG

Hmm und dann? Die "preview" funtkioniert ja schon so wie gewünscht. Das hat ja keinen effekt auf meine textbox.

Hallo zusammen,

ich möchte hier http://test.bac.ag/test-7/
Folgendes erreichen:

Ich habe auf dem thme "jobera" mit dem visual composer ein Bild-/ und ein Textelement eingefügt und dazu jeweils eine css-Klasse angelegt "preview" und " textbox". Dem Bildelement sind die sichtbaren hover-effekte zugewiesen.
Ich möchte nun meine textbox-klasse ebenfalls manipulieren, wenn ich über "preview" hover, schaffe es aber nicht die beiden Klassen so anzulegen bzw. ztu verknüpfen, dass ich mit der einen die andere ansprechen kann.

* {
* {
      -webkit-box-sizing: border-box;
         -moz-box-sizing: border-box;
          -ms-box-sizing: border-box;
    box-sizing: border-box;
}
 
.preview {
     border: 1px solid #000; 
    width: 270px;  
    height: 180px;
       float: left;
     margin: -5px;
      overflow: hidden;  
    text-align: center;
}


#textbox {
opacity:0,5;
}


/*ZOOM*/
.preview img {
     width: 270px;
    height:180px;
    opacity: 0.5;
    float: center;
    transition: all .5s ease-in-out;
        -moz-transition: all .5s ease-in-out;
        -webkit-transition: all .5s ease-in-out;
}
 
.preview :hover {
    max-width: 300px;
    width: 300px;
    height:200px;
    opacity: 1;


}


.textbox {
}

Wie muss ich die Klassen also anlegen, damit ich gewünschten Effekt erreiche, oder muss ich einen zusätzlichen container anlegen, in den ich beide Klassen integriere?

Gruß,
chris

Hallo ArtofPic,

ich stehe nun vor der nächsten Hürde, die mich etwas verzweifeln lässt:

Ich möchte nun ein Textfeld(.textbox) als eine zweite Klasse mit in den hover-effect mit aufnehmen, und dieses mit (visibility: visible)einblenden, wenn man über .preview hovert. Ist das überhaupt so einfach mit css möglich?

Im Prinzip ist es ja der gleiche Effekt, wie bei einem Menu. (Man hovert über der ersten Ebene und die zweite wird eingblendet) Ich habe nun einiges zum Thema Adressieren von css Klassen, Eltern- und Kinderklassen gelesen, aber komme nicht weiter.

http://test.bac.ag/aufrollsysteme-2/ueberflur/

/*ZOOM*/
.preview img {
     width: 270px;
    height:180px;
    opacity: 0.5;
    float: center;
    transition: all .5s ease-in-out;
        -moz-transition: all .5s ease-in-out;
        -webkit-transition: all .5s ease-in-out;
}
 
.preview :hover {
    max-width: 300px;
    width: 300px;
    height:200px;
    opacity: 1;


}




.textbox { 
       background-color: 00ffff; 
        outline: none; 
        padding: 2px 2px; 
        opacity: 1;
    visibility: hidden;


} 
.preview:hover .textbox{
      visibility: visible;
}

Schönen Abend.

Hallo Maria-Anne,

Zitat

Hast Du eine Idee, wie ich das machen könnte?

ich beschäftige mich jetzt seit ca. 1,5 Tagen mit html, php und css und bin daher noch ziemlich unbefleckt.:wink: Trotzdem mal ein Antwortversuch:
Zunächst mal bin ich sicher, dass es diesen und auch so ziemlich alle anderen erdenklichen Hover-effekte in irgendwelchen plugins gibt. Dieser Effekt hier sieht aber relativ simpel aus. Ich denke, man muss ja im Prinzip nur einen Rahmen (border) aus- und einblenden, bzw die Farbe von weiß auf rosa ändern, oder die Breite von 0 auf ein paar pixel ändern...gibt da ja viele Möglichkeiten..
Wenn du z.B. meinen code hier nimmst, und meine "preview"-Klasse dein Bildelement ist, müsstest du halt an Stelle der Transitions, die ich hier habe (opacity und image scale) deinen Rahmen verändern.

Ich hoffe, das hilft dir irgendwie weiter.

Schönen Abend

Ok, also z.B. das addon firebug fon firefox? Ich werden dann erstmal wieder eine Lese-und Lernsession einlegen. :)

Vielen Dank für die Hilfe

Zitat

füge bei .preview :hover noch ein max-width: 300px; hinzu

Hey funktioniert, danke!

Wo finde ich denn die beiden Formatierungen, die hier algemein gelten? Ich nehme an, die werden durch den VC angelegt, da ich den ja verwende um die Grafiken einzubinden?!

Gruß

Hallo,

ich habs jetzt soweit hinbekommen.:http://test.bac.ag/aufrollsysteme-2/ueberflur/

Die Skalierung ist so ok; allerdings funktioniert die Transition( easy-in-out) beim Verlassen des Bildes nicht richtig. Die Breite wird hier ohne Verzögerung zurück gesetzt. Woran könnte das liegen?

* {
      -webkit-box-sizing: border-box;
         -moz-box-sizing: border-box;
          -ms-box-sizing: border-box;
    box-sizing: border-box;
}
 
body {
      background: #333;
    }


.preview {
     border: 1px solid #000; 
    width: 270px;  
    height: 180px;
       float: left;
     margin: -5px;
      overflow: hidden;  
    text-align: center;
}


/*ZOOM*/
.preview img {
     width: 270px;
    height:180px;
    opacity: 0.5;
    float: center;
    transition: all .5s ease-in-out;
        -moz-transition: all .5s ease-in-out;
        -webkit-transition: all .5s ease-in-out;
}
 
.preview :hover {
    width: 300px;
    height:200px;
    opacity: 1;
}

gruß

Zitat

include prüfen >>

ja, das wars. Danke.

Zitat

btw. wenn die Seiten im Wartungsmodus sind, ist es schwierig, was zu lesen :smile:

das ist wohl wahr :) war aber zwischenzeitlich deaktiviert

Hallo,

ich habe ein Probelm mit dem Hover Effekt. Ich wollte einen Grow-Effekt wie hier erstellen: "http://designshack.net/?p=36895" , nur leider will es nicht ganz so funktionieren.

.element {
    opacity: 1;
        background-color: #ffffff; 
        transition: all 0.4s ease-in-out;
        width: 270px;
    height: 200px;
    
}




.element img {
      width: 270px;
      height: 200px;


     
    -webkit-transition: all 1s ease;
         -moz-transition: all 1s ease;
           -o-transition: all 1s ease;
          -ms-transition: all 1s ease;
          transition: all 1s ease;


}
.element img:hover {
  width: 400px;
  height: 400px;


}

Meine CSS-Klasse habe ich in einem Textblock im Visual Composer definiert und den o.g. Code CSS-Fenster vom VC eingefügt. Die Fenster bleiben in der Breite fixiert, das Bild wird nur lang nach unten gestreckt.

Wie kann ich diesen Fehler beheben?

Vielen Dank

sehr gern, pardon:

http://test.bac.ag/

Hallo,

ich schaffe es leider nicht, den Text in meinem Top Menu auf die fontfamily "Open Sans Condensed" umzustellen.

ich nehme an, es ist ein syntax-problem, habe aber schon alle mir logisch erscheinenden Möglichkeiten ausprobiert.

body .sf-menu li a { 
font-size:28px;
font-variant:small-caps;
font-family: Open Sans Condensed;
background-color:transparent;
}

der font ist ist definitiv in dem theme "jobera" enthalten

eine weitere Anfängerfrage:

wenn ich die style.css im editor manipuliere, werden Änderungen scheinbar gar nicht, oder nur mit sehr langer Verzögerung(20 min.) wirksam

Wenn ich die codeschnipsel aber in "Design-> theme options -> custom css " und dort aktualisiere, sehe ich die Änderungen sofort. Meines Wissen nach wird die style.css hierdurch einfach overrult?!

Woran liegt das?

Gruß,
Chris

ja, ich werde da auch posten, schien mir nur relativ verwaist der support dort

gar keinen Teller, weil ich zurzeit keine Fotos darstelle, sondern hochauflösende renders der Produkte

CAD-Modelle drehen geht ohne Hardware :)

Hallo,

ich nutze o.g. plugin (pro version) und habe das Problem, daß die Hotspots nicht dargestellt werden.

In der html-prewiew der webrotate software werd alles richtig angezeigt.

Kennt jemand das Problem und kann mir helfen?

Danke und Gruß,

Christian