[easy_bg_stretcher] Easy background stretcher

[christian.barkowsky]

Easy background stretcher.

Contao 2.10 - 2.11 --> http://contao.org/de/extension-list/...000009.de.html

Contao 3.0 -->http://contao.org/de/extension-list/...000019.de.html

Hintergrundbilder auf einfache Art und Weise über den ganzen Bildschirm strecken lassen.

1. Neues Inhaltselement vom Typen Easy Background Stretcher anlegen
2. Bild auswählen
3. Fertig

WICHTIG für Contao 2 Installationen: jquery und das moo_jquery_nc Template muss eingebunden sein.

[Manja]

Erst einmal herzlichen Dank für diese auf für mich als Anfängerin leicht zu bedienende Erweiterung.
Ich habe jetzt nur das Problem, dass ich eine Fehlermeldung erhalten, wenn ich versuche gleichzeitig eine ganz simple Fotogalerie in der rechten Spalte einzusetzten.
Meine Vermutung ist, dass es mit dem javascript zusammenhängt. Gab es da schon andere Meldungen in der Richtung?

Die Meldung lautet:
Warning: Illegal string offset 'top' in C:\xampp\htdocs\stift_2013\system\modules\backend\ TrblField.php on line 135
#0 C:\xampp\htdocs\stift_2013\system\modules\backend\ TrblField.php(135): __error(2, 'Illegal string ...', 'C:\xampp\htdocs...', 135, Array)
#1 C:\xampp\htdocs\stift_2013\system\libraries\Widget .php(460): TrblField->generate()
#2 C:\xampp\htdocs\stift_2013\system\modules\backend\ templates\be_widget.html5(3): Widget->generateWithError(true)
#3 C:\xampp\htdocs\stift_2013\system\libraries\Widget .php(418): include('C:\xampp\htdocs...')
#4 C:\xampp\htdocs\stift_2013\system\modules\backend\ DataContainer.php(439): Widget->parse()
#5 C:\xampp\htdocs\stift_2013\system\drivers\DC_Table .php(1748): DataContainer->row('{type_legend},t...')
#6 C:\xampp\htdocs\stift_2013\system\modules\backend\ Backend.php(287): DC_Table->edit()
#7 C:\xampp\htdocs\stift_2013\contao\main.php(120): Backend->getBackendModule('article')
#8 C:\xampp\htdocs\stift_2013\contao\main.php(230): Main->run()
#9 {main}

[christian.barkowsky]

Hey Manja,

auf den ersten Blick sieht da nix nach meiner Erweiterung aus.
Welche Module hast du zusätzlich installiert?!

[valentin]

Was ich aber umständlich finde ist, dass ich für jede Seite ein Inhaltselement mit dem BG Streicher anlegen muss.
Gibt es nicht auch eine Möglichkeit EIN Hintegrundbild für ein Seitenlayout zu wählen?
Ich hab´s über das Insert-Tag {{insert_article::XX}} versucht und damit ein Module von einem Artikel erstellt, welches ich dann in das Seitenlayout getan habe - hat nicht funktioniert.

An sonst aber echt super und einfach gemacht, Danke!

[christian.barkowsky]

@valentin ... tHx.

das was du willst passt prima zum coverpicture.
diese extension muss ich noch fit für contao 3 mache ... da könnte ma mit beiden modulen genau das erreichen.

[imacfan]

Was ich aber umständlich finde ist, dass ich für jede Seite ein Inhaltselement mit dem BG Streicher anlegen muss.
Gibt es nicht auch eine Möglichkeit EIN Hintegrundbild für ein Seitenlayout zu wählen?
Ich hab´s über das Insert-Tag {{insert_article::XX}} versucht und damit ein Module von einem Artikel erstellt, welches ich dann in das Seitenlayout getan habe - hat nicht funktioniert.

An sonst aber echt super und einfach gemacht, Danke!

Habe das gerade so gelöst:
- Erweiterung installieren
- auf beliebiger Seite über das Inhaltselement ein Hintergrundbild laden
- Quellcode dieser Seite anzeigen lassen und daraus die beiden Scriptzeilen kopieren (Beispiel aus meiner Installation)

<script src="system/modules/contao_easy_bg_stretcher/assets/js/jquery.backstretch.min.js"></script>
<script>jQuery(document).ready(function(){ jQuery.backstretch("Pfad_zu_deinem_Hintergrundbild"); });</script>

- die Scriptzeilen als zusätzliche head tags im Seitenlayout einfügen
- dann ist dein Hintergrundbild auf allen Seiten (die dieses Seitenlayout haben)
- das Inhaltselement danach wieder löschen

Vielleicht nicht im Sinne des Erfinders - funktioniert aber

[christian.barkowsky]

Hallo,

ich werde zusätzlich zum Inhaltselement noch die Modul-Variante einbauen ... und das noch 2012.

[imacfan]

das ist super. Vielen Dank für dein Engagement.

[ph!L]

Hallo Christian,

vielen Dank für Deine Extension, ich würde mich sehr über die Erweiterung zum Modul in 2012 freuen... noch sind es ja ein paar Tage ;-)

Viele Grüße aus Berlin,

Philipp

[christian.barkowsky]

Fertig.

Der Stretcher kann nun auch als Modul eingesetzt werden.

https://contao.org/de/extension-list...000029.de.html

[rezico]

Hey Christian,
vielen dank für deine Erweiterung.
Ein Problem habe ich bzgl. der neuen Version:
Ich kann kein Modul anlegen

Bei der Modulerstellung habe ich keine Option zur Erstellung eines Easybgstretcher Moduls.

Mache ich irgendetwas falsch?

Vielen Dank!

Edit:/ Ah, es geht wohl nicht in der 2.11 Version Schade!
Edit2:/ Ha, aber was funktioniert: Modul -> Eigener HTMl Code -> via Inserttag das Element einbinden -> ins Seitenlayout -> fertig!

[christian.barkowsky]

Hi Rezico,

die 2.11 ist ja bald Geschichte ... in der 3er Version geht es.
Aber hast ja eine Lösung gefunden.

[rezico]

bald ist gut
Solange der Catalog bzw. Metamodels nicht C3 fähig sind, kann ich mit der neuen Version kaum was anfangen (zumindest in größeren Problemen, und abgesehen davon geht mir die Dateisynchronisationsgeschichte auf die Nerven )

[christian.barkowsky]

*hehe*

Vielleicht baue ich das ja noch ein.

Die Dateisynchronisationsgeschichte ist sehr sehr nützlich ... aber das kann gern an anderer Stelle diskutuert werden.

[christian.barkowsky]

Neues Feature: Es kann nun zusätzlich ein Verzeichnis als Bildquelle angegeben werden. Das Hintergrundbild wird anschließend per Zufallsprinzip ausgewählt.

Version 1.0.3 https://contao.org/de/extension-list...000039.de.html

[valentin]

Da ist ja einiges Weitergegangen.
Was mich jetzt noch interessieren würde: Jetzt wo man einen Ordner auswählen kann. Kann ich aus diesem Order eine Slideshow mit fademachen?
Geht das überhaupt?
Wäre cool!

Danke und LG,
Valentin

[christian.barkowsky]

Hallo Valentin,

sicher ein interessantes Feature ... ich werd das mal auf den Plan schreiben.

[valentin]

ja, aber dann müsstest du deine Extension umbenennen und das "Easy" raustun! ;-)

Gäbe es eine Möglichkeit, das temporär über eine Tweak (zbsp in der .js) zu erreichen?

[christian.barkowsky]

JS ausstauschen und Code anpassen.

[valentin]

Also ganz "easy". Naja, vielleicht warte ich einfach... ;-)
Danke jedenfalls für die tolle Extension!

[mike_mcfly]

1. Neues Inhaltselement vom Typen Easy Background Stretcher anlegen
2. Bild auswählen
3. Fertig

...hm, hab' ich gemacht. jQuery ist an... doch: nix Hintergrundbild ;(

Hab's auch als Modul probiert: nix #(

Contao: 3.0.6

[christian.barkowsky]

@mike_mcfly ... hab dir ne PM geschickt.

Mikes Problem behoben ... das CSS hat die Background - Eigenschaften der Erweiterung überschrieben.

[mike_mcfly]

Ahoi zusammen,

mit Christians Hilfe via Teamviewer konnten wir das Problem ausfindig machen.

Es lag an einer CSS-Anweisung:

#wrapper {
	background-color: #fff;
}

Die habe ich entfernt und jetzt funktioniert's – Danke noch mal an Christian!

[peter_lang]

Hi

habe die Erweiterung eingebunden in die 3er Version. Läuft.
Ein Problem kommt jetzt, ich möchte einen Layer über den bgstrecher mit einem Kachelbild haben. Habe die Kachelung in den bodytag eingebunden. Aber sie wird nicht angezeigt, kann es sein, dass der bgstrecher über der body Kachelung liegt?

Wie kann ich die Kachelung anzeigen?

thx im Voraus

[mike_mcfly]

Hi

habe die Erweiterung eingebunden in die 3er Version. Läuft.
Ein Problem kommt jetzt, ich möchte einen Layer über den bgstrecher mit einem Kachelbild haben. Habe die Kachelung in den bodytag eingebunden. Aber sie wird nicht angezeigt, kann es sein, dass der bgstrecher über der body Kachelung liegt?

Wie kann ich die Kachelung anzeigen?

thx im Voraus

Probier's doch mal mit dem #wrapper....

[peter_lang]

HI,

ja beim wrapper funzt es zwar aber seltsamerweise is nur so breit wie der content. Also nicht über die ganze Fläche, als wenn ich es im body hätte.

[Dr. Jo]

Hallo Christian,

mir ist ein anderes Phänomen aufgefallen: Wenn ich ein Querformatbild (1600x1200px) über den easy_bg_stretcher einbinde, funktioniert das so lange ganz gut, wie das Bildschirmformat nicht schmaler als ca. 3:2 wird. Schon bei 4:3 zieht der stretcher das Bild nicht mehr auf die gesamte Fläche auf, so dass unten ein weißer Streifen sichtbar wird. Bei Mobilgeräten im Hochformat wird das natürlich noch deutlicher sichtbar. [Für ein älteres Projet hatte ich mal den bgstretcher eingesetzt, der hat das Problem nicht und schneidet halt rechts und links was an; ist aber nur bis 2.10 freigegeben]

Hast Du eine Idee, wie man da vorgehen könnte?

Gruß

Dr.Jo

[christian.barkowsky]

@Dr.Jo ... kannst du mir bitte via PM ein Beispiel oder die URL schicken. tHx.

[herr rilke]

hallo,

ich habe auch ein merkwürdiges verhalten auf localhost.

eingebunden ist das ganze als modul und wird im seitenlayout geladen.

firebug berichet jquery.backstretch.min.js würde versucht werden zu laden (steht also im quelltext), bekommt aber nicht die erlaubnis... ??

<script src="system/modules/contao_easy_bg_stretcher/assets/js/jquery.backstretch.min.js">
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">
<head>
<title>Zugriff verweigert!</title>
<link rev="made" href="mailto:postmaster@localhost" />
<style type="text/css"><!--/*--><![CDATA[/*><!--*/
body { color: #000000; background-color: #FFFFFF; }
a:link { color: #0000CC; }
p, address {margin-left: 3em;}
span {font-size: smaller;}
/*]]>*/--></style>
</head>
<body>
<h1>Zugriff verweigert!</h1>
<p>
Der Zugriff auf das angeforderte Objekt ist nicht m&ouml;glich.
Entweder kann es vom Server nicht gelesen werden oder es
ist zugriffsgesch&uuml;tzt.
</p>
<p>
Sofern Sie dies f&uuml;r eine Fehlfunktion des Servers halten,
informieren Sie bitte den
<a href="mailto:postmaster@localhost">Webmaster</a>
hier&uuml;ber.
</p>
<h2>Error 403</h2>
<address>
<a href="/">localhost</a><br />
<span>Apache/2.4.2 (Win32) OpenSSL/1.0.1c PHP/5.4.4</span>
</address>
</body>
</html>

jemand eine idee, warum das so ist?


viele grüße aus münster!

[willshedo]

Hi,

hmmm, in Version 3.1.0 behauptet Firebug : "TypeError: jQuery.backstretch is not a function" und ein Hintergrundbild wird nicht angezeigt, wederals Modul noch als Inhaltselement. Jquery ist eingebunden, jquery.backstretch ebenso.
Chrome Developer Tools meint: "Uncaught TypeError: Object function (e,t){return new b.fn.init(e,t,r)} has no method 'backstretch' "
Sowas....

[matthias123]

HAllo, finde diese Erweiterung super!

Leider habe ich ein kleines Probelm: Will diese Erweiterung bei einer Responsive Seite verwenden aber auf dem iPhone springt das Hintergrundbild beim scrollen. Zuerst geht das Bild mit dem Inhalt mit und es bleibt unten ein weißer Balken, dann vergrößert sich das Bild um den Balken zu verdecken.

Das wirkt ziemlich unruhig!

Gibt es da einen Lösungsansatz?

[schlafsack]

Hallo
gibt es eine Möglichkeit das Hintergrundbild in einen Rahmen zu betten?
Ich würde gerne einen gleichgroßen Rahmen um das Bild haben. Jemand eine Idee wie ich das umsetzten kann?

[Kahru]

Moin,

unter C31 läuft Deine Erweiterung wohl leider nicht. Wird die demnächst angepasst?

Gruss
Bernard

[wulf]

läuft auch unter 3.1.1, man muss allerdings mit dem autoload-creator eine autoload.php erstellen

[christian.barkowsky]

Das passe ich noch an. Keine Angst.

[xkoy]

Hi,

habe es jetzt unter 3.1.1 laufen, geht gut. jedoch wen ich es als Inhaltselement erstelle, kann ich nur 1 Bild auswählen, und keinen Ordner?!
Ist das normal?

Danke
Dani

Ps.: Ah ok, nur im Modul möglich!

[AndiK]

Der Easy Background Stretcher funktioniert an sich wunderbar.

Kann man denn auch das Bild an sich noch ausrichten?

Ich habe hier Bilder, die weit nach links (ca. -400 Pixel) versetzt sind, die ich aber gerne beginnend mit Pixel 0 von links ausgerichtet haben möchte. Der obere Rand beginnt bei 0, den hätte ich gerne bei +100px.

Kann man das via CSS steuern?

lg
Andi

[AndiK]

Ahh: Habe es selbst herausgefunden. Mann muss im Script die Änderungen vornehmen.

[AndiK]

Jetzt habe ich doch noch ein großes Problem, bei dem ich eure Hilfe benötige:

Die von mir verwendeten Bilder werden in Breite und Höhe nicht der Seite genau angepasst. Sie sind immer circa 15% zu breit und zu hoch.

Kann man den Stretcher auch so anpassen, dass die Bilder dem #container angepasst werden?

[AndiK]

Niemand eine Idee?