Hallo Frank,
wenn dir das Design "Leonidas" gefällt, dann kannst du folgenden Code nach deinen Wünschen anpassen:
Diesen Code fügst du dir bei "Datei" -> "Website-Eigenschaften" -> Reiter "HTML" im "<head>-Bereich" oder im "Am Anfang des <body>-Bereich" ein:
<style>
@media (min-width: 768px) {
.sqr {
.sqrlogo {
transition-property: transform;
transform-origin: top left;
transform: scale(5.0);
transition-duration: 1s;
z-index: 1001;
}
}
.sqrfixedmenu {
.sqrlogo {
transition-property: transform;
transform-origin: top left;
transform: scale(4.0);
transition-duration: 1s;
z-index: 1001;
}
}
}
@media (max-width: 767px) {
.sqrnav > ul > li > a, .sqrnav > a {
text-align: right !important;
}
.sqrnav a {
padding: 10px 50px !important;
}
.sqr {
.sqrlogo {
position: fixed;
top: 0;
margin: 0 !important;
transition-property: transform;
transform-origin: top left;
transform: scale(1.0);
transition-duration: 1s;
z-index: 1001;
}
}
.sqrfixedmenu {
.sqrlogo {
transition-property: transform;
transform-origin: top left;
transform: scale(1.2);
transition-duration: 1s;
z-index: 1001;
}
}
}
</style>
Weitere Anpassungen kannst du selber vornehmen.
z.B. bei den Zeilen: transform: scale(Faktor); kannst du die Logo-Größe mit Faktor des Bildes (z.B. 1.2 = Faktor 1,2 ) angeben.
Bzgl. transparender Effekt: Das Logo selbst sollte unten natürlich entsprechend Teiltransparent oder Transparent sein, so wie das Vorbild auf das du mit deinem Link verweist.
Viel Spaß bein ausprobieren.
Mit freundlichen Grüßen
Thomas
Web To Date seit 2004, Siquando Web 12, Pro Web 9, Web Client