Cover Image Fullsize Background MooSize

[zuckerschnute1985]

also hab mal nachgeschaut, steht aber leider kein wert in der zeile drin.
haben unsere seite nach der anleitung nachgebaut:
http://de.contaowiki.org/Fullsize_Ba...Tools_MooSizer

und da sollte doch eigentlich das hintergrundbild entsprechend der auflösung angepasst werden, oder? haben das pic auch in der beschriebenen auflösung hochgeladen.
es funtkioniert auch, das man verschiedene seitenbilder hat, nur das die bilder halt nicht komplett sondern im ausschnitt dargestellt werden.
wir benutzen contao vers. 2.11.4

[tblumrich]

Hi.

Die Beschreibung ist ja noch für 2.9.
Habt ihr eventuell nicht die richtige Templateendung bei der Erstellung des moo_moosize templates beachtet? TPL eh nicht mehr... wenn dann XHTML oder HTML5, je nachdem was ihr im Frontend benutzt?

Wenn ja, auch eingebunden, spricht im Seitenlayout angehakt?

Klingt nämlich danach, als wenn das Moosize-Script nicht arbeitet.

Kann man das ansehen?

Gruß
Thomas

[zuckerschnute1985]

Hi.

Die Beschreibung ist ja noch für 2.9.
Habt ihr eventuell nicht die richtige Templateendung bei der Erstellung des moo_moosize templates beachtet? TPL eh nicht mehr... wenn dann XHTML oder HTML5, je nachdem was ihr im Frontend benutzt?

Wenn ja, auch eingebunden, spricht im Seitenlayout angehakt?

Klingt nämlich danach, als wenn das Moosize-Script nicht arbeitet.

Kann man das ansehen?

Gruß
Thomas

Daran wirds wohl liegen... Müssen die Pageimage-Templates auch HTML5 Endungen haben? Muss danach im Skript noch was geändert werden? Wo sind die Pageimage-Templates überhaupt eingebunden?

Danke für eure Hilfe! Tolles Forum hier

Edit: Wir haben das grad alles probiert und irgendwie sieht man das Bild nicht mal mehr durch transparenten Content-Bereiche...
Könnte mal einer gucken bitte? Ist nur das Modul drauf und die erste Seite nach der Anleitung von Contao-Wiki...

Der Link ist: www.stefaniekloss-fanclub.de/contao/contao
Benutzername: contao2
Passwort: contao1234

[tinoo]

Einloggen im Backend bringt nix, weil man nichts zu sehen bekommt.

Also wenn ich http://www.stefaniekloss-fanclub.de/contao/ öffne, wird ein Hintergrundbild meiner Meinung nach
korrekt geladen und verkleinert/vergrössert, je nach Browserfenster.

Wenn ich aber nur http://www.stefaniekloss-fanclub.de öffne, kommt eine Seite mit Frames?

[Goody]

Liebes Forum,

ich habe auch nach der Anleitung im wiki (page_images 1.3.1) mit Contao 2.11.4 versucht die Erweiterung zu installieren. Habe die Templates entsprechend der Anleitung mit der Endung .html5 angepasst. Wo wird eigentlich auf das Template "pageimagesimage.html5" zugegriffen, da in meinem Quellcode kein "div id="passepartout" existiert sondern nur

<figure class="image_container">
*¶
<img width="2560" height="1600" alt="DSC01391" src="tl_files/tom_wolf/pageImages/DSC01391.jpg">
*¶
</figure>

Das Modul habe ich im Seitenlayout in den header eingebunden, aber es skaliert sich leider nicht auf das Browserfenster. Wahrscheinlich weil das CSS nicht greift.
Hat jemand eine Idee?

Gruß Goody

[Messa]

Du musst auch den Code abändern
Steht ja so in der Anleitung.
Es ist wichitig, dass der aufbau gleich ist sonst funktioniert es nicht.

<div id="passepartout">
<div id="supersize"<?php if ($this->margin): ?> style="<?php echo $this->margin; ?>"<?php endif; ?>>
<?php if ($this->href): ?>
<a href="<?php echo $this->href; ?>"<?php echo $this->attributes; ?> title="<?php echo $this->alt; ?>">
<?php endif; ?>
<img class="activeslide"  src="<?php echo $this->src; ?>"<?php echo $this->imgSize; ?> alt="<?php echo $this->alt; ?>" />
<?php if ($this->href): ?>
</a>
<?php endif; ?>
<?php if ($this->caption): ?>
<div class="caption"><?php echo $this->caption; ?></div>
<?php endif; ?>
</div>
</div>

Für HTML5 musst du es anpassen.

Du kannst nicht das original verwenden der Erweituerng verwenden, da diese nicht fullsize unterstützt!

lg Matthias

[Messa]

Hier die Alpha meiner Erweiterung.

https://www.contao-community.de/show...410#post217410

lg Matthias

[strawberry]

Hab nur 1 Background image, das auf allen Seiten gleich sein soll.
Problem, der Internet Explorer (8 und die anderen IEs wahrscheinlich auch)

Habs mit cover (s.u.) versucht, aber der IE macht kein resize auf die Grösse des Browserfensters.
schade eigentlich, das wäre zu einfach gewesen.

background: url(images/bg-kaese.jpg)no-repeat center center fixed ;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;


Ausserdem, kommt die Transparency im IE sehr hässlich raus. Wie löse ich das mit Contao am besten??
Da ist mein CSS wie folgt:

.transp60{
/* Fallback for web browsers that doesn't support RGBa */
background: rgb(0,0, 0) transparent;
/* RGBa with 0.6 opacity */
background: rgba(0, 0, 0, 0.8);
/* For IE 5.5 - 7*/
filterrogidXImageTransform.Microsoft.gradient(startColorstr=# 99000000, endColorstr=#99000000);
/* For IE 8*/
-ms-filter: "progidXImageTransform.Microsoft.gradient(startColorstr=# 99000000, endColorstr=#99000000)";

}

Danke für Eure Tips und Tricks...

[Andreas]

Versuchs mal hiermit für die Bildqualität http://msdn.microsoft.com/en-us/libr...8VS.85%29.aspx

Versuche auch mal -ms-background-size. Hier gibt es evtl. auch ne Lösung http://css-tricks.com/perfect-full-p...kground-image/. Ansonsten dem IE ein Bild geben, in den Hintergrund und Werte für Breite und Höhe dynamisch mit JS zuweisen.

Oder am besten dort auf ein Feature verzichten wo es nicht unterstützt wird.

[Messa]

@strawberry

CSS ":cover" geht auch nicht in den alten Browsern.
Vorallem bist du hier falsch
Hier geht es um den Mootool Script der ein hintergund Bild Fullsize macht.
http://www.css3.info/preview/background-size/ ganz unten steht welche Broweser COVER unterstützden.
Und sonst verwende meine Erweiterung.
https://www.contao-community.de/show...d-mit-Mootools

lg Matthias

[mtness]

Hallo Alle,

freut mich, dass Euch der MooSizer gefällt!

Auf die Frage nach der slideshow/gallery Funktion, ich hab mal eine standalone demo erstellt: [Besser spät als nie]
http://mtness.net/demos/moosimpleslideshow/

Vielleicht kann das ja einer gebrauchen.

Kind regards, mtness.

[Messa]

@mtness Das Demo gibt es doch schon ewig
Hab es schon vor über 1 Jahr gesehn.
Vorallem habe ich in diesem Beitrag weiter vorne schon beschrieben.
Wie man die Slideshow auch verwenden kann

Und interessanter wäre wenn du den Script-Link auch noch posten würdest.
http://mtness.net/demos/moosimplesli...ideshow.1.0.js

Aso und noch was ich hoffe es passt für dich habe für eine freie Erweiterung deinen
Script für das Fullsizen verwendet.

lg Matthias

[Messa]

Leider geht das Bearbeiten momentan nicht im Forum
@mtness
Danke für den Script

lg

[chinagirl]

hallo messa!

ich finde deine anleitung super!!!

diese diskussion ist ja schon länger her, hast du vielleicht dran weiter gearbeitet, auch an der slideshow?

eine große bitte hätte ich an dich:
das hat weniger mit deiner fullsize_background anleitung zu tun, die bekomme ich gut hin.
leider sind meine css kenntnisse nicht so toll und ich habe probleme mit den divs (logo, content...).
manche verschwinden, wenn man das browserfenster auseinanderzieht.

kannst du mir vielleicht von We-are.cc das css schicken?

wäre super!!!

vielen dank und lieben gruß,
chinagirl

[Messa]

Hallo.

Stell doch bitte einen Link online, dann kann ich schauen an was es liegt.
Generell bei Contao #Wrapper eine breite definieren, dann verschwiendet auch nichts.
Z-index kann nicht schuld sein da das BG_Bild auf Z-index -1 gestellt ist.
Du kannst dir über Quellcode auch das CSS anschauen. Da muss ich dir
nichts senden

lg Matthias

[chinagirl]

hi messa,

danke für deine rasche rückmeldung !
hier der link.
es geht um das rote feld, die navigation.
schiebe das browserfenster zusammen, dann kannst du es sehen.

das css hab ich im quellcode mir angesehen, bin aber trotzdem nicht dahinter gekommen, was bei dir stimmt und bei mir nicht .

danke und lieben gruß,
chinagirl

[Messa]

Hast du eventuell media query drinnen?
@media (min-width:700px) { … } sowas.

Sieht aus als würde das Feld auf display none gestellt werden bei einer
bestimmten Browserfenstergröße.

lg Matthias

[chinagirl]

nein hab ich nicht ....

lg, chinagirl

[Messa]

Glaube das ist schuld.

#left {
    margin-left: -100%;
}

lösch das raus.

lg Matthias

[chinagirl]

das hab ich in meinen code gar nicht stehen.
schicke dir anbei mein css.

lg chinagirl

[Messa]

Irgendwoher muss das kommen.
Schau mein Bild an.
Habe es mit Firebug gefunden.

Schick mir mal dein BE Zugang per PN.

[BugBuster]

das

#left {
    margin-left: -100%;
}

kommt vom Layout Builder zum layouten des Holy Grail Layouts und ist demzufolge richtig. (wenn man eine Left Spalte aktiviert hat)

PS: das scheint also Contao 3 zu sein.

[Messa]

Ja dann ist es ja responsable Design.
Dann verschwinden gewisse Sachen.
Eventuell ist da doch etwas eingestellt.

Sorry arbeite noch nicht mir Contao 3.
Solange die ganzen Erweiterungen noch nicht
auf 3 laufen.

Sonst stell deine Frage bitte in https://community.contao.org/de/foru...tes-Holy-Grail

Da ich denke, dass es nichts mit dieser Anleitung zu tun hat.

lg Matthias

[chinagirl]

ja es ist contao 3.0.3

[Messa]

Also wie schon richtig von mir erkannt :P
Es liegt an dem CSS was erstellt wird und zwar das
von dem "Layoutbuilder" denke das der responsable arbeitet
und ab ca 700px (nur geschätzt) den Bereich #left auf - 100px margin-left setzt.
Damit der weg ist.

lg Matthias

[chinagirl]

danke messa!
nur leider funktioniert das skalierbare hintergrundbild jetzt nicht mehr

lg, chinagirl

[Messa]

ka.
Eventuell brauchts ein Framework damit der Script geladen wird.
Wie gesagt es liegt NICHT am Script um denn es hier in diesem Post
geht, frag nochmals im Layout Bereich des Forums nach.

Da ich wie gesagt mit der 3 Version noch nicht arbeite kann
ich dir nicht viel dazu sagen

lg Matthias

[chinagirl]

ja mach ich!
danke auf jeden fall!

lg, chinagirl

[Psi]

thread nicht gelesen, nur topic...

Vllt taugt das hier: https://contao.org/de/extension-list...Slider.de.html

[chinagirl]

klingt perfekt!
danke für den tipp!!!

[chinagirl]

Vllt taugt das hier: https://contao.org/de/extension-list...Slider.de.html

ich habe die erweiterung ausprobiert unter "I DO" kannst du dir es ansehen.

was mir jedoch nicht gefällt ist, dass das hintergrundbild nicht in der proportion bleibt.

kann man da noch etwas einstellen?

lg,
chinagirl

[andrea$]

Hallo Leute.

Habe mir gedacht ich trage das hier auch noch ein
Falls jemand in diesem Unterforum sucht.

Habe ein Tutorial erstellt wie PageImage als Fullsize-Backround verwendet werden kann.
Mit MooTools

http://de.contaowiki.org/Fullsize_Ba...Tools_MooSizer

Liebe Grüße
Matthias

Die 150 Antworten spare ich mir mal zu lesen. Arbeite mit Cto 3.3.5. die Bilder werden angezeigt jedoch funktioniert slideshow nicht. Ist der Code im Wiki aktuell?