Diese Anzeige ist nur für
Nicht-Mitglieder sichtbar!

Jetzt kostenlos registrieren

Stretchbox

Du brauchst Tipps oder Anregungen zu deiner Homepage und willst, dass diese noch besser wird? Dann zeig sie uns!

Moderatoren: Basti, Ingo, Andreas W.

Stretchbox

Beitragvon Janik am 08.09.2011, 21:56

Hallo alle zusammen,

ich bin grade dabei mein Fotografie Portfolio http://www.photogen.eu zu erneuern. Dabei habe ich mir vorgenommen eine vollbild Galerie mit einzubauen. An dieser Stelle hatte ich angedacht auf eine Lightbox XY zurückzugreifen, hab mich dann aber doch dazu entschieden, etwas eigenes zu gestalten und programmieren.

Meine Zielsetzung ist es durch das Klicken auf einen entsprechenden Link die Galerie komplett über die Website zu legen. Dabei sollen die Fotos entweder ins Browserfenster eingepasst werden oder so skaliert werden, dass sie die gesamte Bildfläche ausfüllen und auf einer Achse verschoben werden können, je nachdem ob Quer- oder Hochformat.
zur Auswahl der Bilder soll sich am unteren Bildrand eine Übersicht mit Thumbnails befinden.

Das mag beschrieben zunächst etwas wirr klingen, also lasse ich einfach mal zwei Screenshots sprechen:

Bild

Bild

Und jetzt kommt ihr ins Spiel: Ich habe überlegt das ganze als jQuery Plugin zur freien Verfügung zu stellen, falls das ganze erfolgreich umgesetzt wird. Daher brauche ich Unterstützung, das ganze auf verschiedenen Plattformen Browsern etc. zu testen.

Momentant bin ich noch am programmieren, aber bald schon wird eine erste Vorab Version (die zunächst statisch ist) Online gehen.

lg, Janik
Benutzeravatar
Janik
Mitglied
 
Beiträge: 168
Registriert: 07.10.2008, 09:01
Diese Anzeige ist nur für
Nicht-Mitglieder sichtbar!
 
Jetzt kostenlos registrieren

Re: Stretchbox

Beitragvon Mctigger am 09.09.2011, 22:11

Hab ziemlich genau des selbe auch schomal gemacht.

Find ich gut das du ein Plugin draus machen willst. Helfe gerne mit :D
Mctigger
Mitglied
 
Beiträge: 75
Registriert: 16.12.2010, 16:58

Re: Stretchbox

Beitragvon trixster am 10.09.2011, 09:16

Mal abgesehen davon... deine Bilder sind wirklich genial.
Benutzeravatar
trixster
Mitglied
 
Beiträge: 483
Registriert: 05.03.2009, 16:23

Re: Stretchbox

Beitragvon Janik am 11.09.2011, 03:41

Vielen Dank zunächst :)
Mctigger, hast du was zum vorzeigen?

lg, Janik
Benutzeravatar
Janik
Mitglied
 
Beiträge: 168
Registriert: 07.10.2008, 09:01

Re: Stretchbox

Beitragvon Mctigger am 11.09.2011, 12:55

Ne sry. Ich verwerfe Sachen immer wieder schnell, wenn sie mir langweilig werden.

Aber jetzt haste mich motiviert es selbst nochmal zu versuchen : D


EDIT: Ok, meine Strechbox (sehr statisch :D) funktioniert soweit, bis auf folgendes: Wie zentriere ich Bilder mit Variabler Breite, da 100% Höhe?
Mctigger
Mitglied
 
Beiträge: 75
Registriert: 16.12.2010, 16:58

Re: Stretchbox

Beitragvon Janik am 11.09.2011, 18:31

Entweder mit 'margin: 0 auto;' dadurch werden sie zentriert oder du berechnest den Abstand nach links in Abhängigkeit von der Bildbreite und der Browserbreite.

Eine erste Version als statische Website gibt es hier: http://janiklipke.com/stretchbox/

lg, Janik
Benutzeravatar
Janik
Mitglied
 
Beiträge: 168
Registriert: 07.10.2008, 09:01

Re: Stretchbox

Beitragvon Janik am 11.09.2011, 21:22

Auf meinem Posters Blog schreibe ich übrigens etwas ausführlicher über die Funktionen Techniken etc.

http://janiklipke.posterous.com/

lg, Janik
Benutzeravatar
Janik
Mitglied
 
Beiträge: 168
Registriert: 07.10.2008, 09:01

Re: Stretchbox

Beitragvon Guillermo am 15.09.2011, 17:08

Wirklich sehr stark umgesetzt bist jetzt, 1A Arbeit.

Ich gebe positives Feedback bei gleichem Verhalten fuer:
- Chrome, MacOS, Version 13
- Safari, MacOS, Version 5.0.5
- Firefox, MacOS, Version 5.0.1 (Ruckelt ein klein wenig beim "Strechen")

Viele Gruesse,
Guillermo
Gebildet ist der, der weiß, wo er findet, was er nicht weiß.
Benutzeravatar
Guillermo
Moderator
 
Beiträge: 1093
Registriert: 01.10.2007, 18:18
Wohnort: Bayern

Re: Stretchbox

Beitragvon Janik am 20.09.2011, 19:06

Danke zunächst fürs Feedback.

Ich habe nun eifrig weiter programmiert und bin bei einer Version angekommen, die bereits mit Bildklassen arbeitet und somit prinzipiell dynamisch einsetzbar ist. Je nachdem wie schnell ich das umgesetzt kriege kommt also sehr bald eine Version zum Downlaoden und testen.

Auf dieser Seite sieht man ein Einzelbild bzw. eine Bildserie http://janiklipke.com/stretchbox/index2.html

Der Link ist ganz einfach wie folgt aufgebaut:
Code: Alles auswählen
<a href="stretchbox/01.jpg" class="stretchbox_single"><img src="stretchbox/thumbs/01.jpg"</a>


Der href-Link verweist dabei auf das Bild in voller Größe das Bild im Link ist der Thumbnail. Bei entsprechenden Bildserien wird die Klasse der zusammenhängenden Bilder auf "stretchbox_multi" geändert.

Die verschiedenen großen der Thumbnails in der Bildserie habe ich bewusst so gewählt, um zu demonstrieren, dass die Bilder automatisch auf 60x60 eingepasst und zentriert werden. Was meint ihr?

lg, Janik
Benutzeravatar
Janik
Mitglied
 
Beiträge: 168
Registriert: 07.10.2008, 09:01

Re: Stretchbox

Beitragvon Janik am 27.09.2011, 23:10

Ich habe eine erste Version fertiggestellt. Dürfte erfahrungsgemäß noch echt buggy sein, aber ich bin dran.

Alle weiteren Infos findet ihr unter http://janiklipke.com/stretchbox/

Über Kritik Anmerkungen und Verbreitung freue ich mich natürlich :)

lg, Janik
Benutzeravatar
Janik
Mitglied
 
Beiträge: 168
Registriert: 07.10.2008, 09:01

Re: Stretchbox

Beitragvon Mctigger am 28.09.2011, 12:58

Wenn ich die auf deiner Homepage benutze, wie beende ich sie dann wieder, um mich wieder der Seite zu widmen`?
Mctigger
Mitglied
 
Beiträge: 75
Registriert: 16.12.2010, 16:58

Re: Stretchbox

Beitragvon Guillermo am 28.09.2011, 14:46

Mit der Escapetaste kommst du wieder raus.

@Janik: Wenn man ein bisschen runterscrollt und dann ein Bild oeffnet ist der Seitenabstand nach oben immer 0, drum sieht man die Bilder nur wenn man wieder ganz nach oben raufscrollt, das wuerde ich noch aendern :)

Viele Gruesse,
Guillermo
Gebildet ist der, der weiß, wo er findet, was er nicht weiß.
Benutzeravatar
Guillermo
Moderator
 
Beiträge: 1093
Registriert: 01.10.2007, 18:18
Wohnort: Bayern

Re: Stretchbox

Beitragvon creativecreation am 28.09.2011, 16:13

Positiv auf Win7 FF 6.0.2
Mir gefällt das teil sehr :D
Benutzeravatar
creativecreation
Mitglied
 
Beiträge: 312
Registriert: 26.10.2010, 10:44
Wohnort: Ulm

Re: Stretchbox

Beitragvon Janik am 28.09.2011, 16:29

Dankeschön :)

@Guillermo Das wurde mir auch schon gemeldet, unschöner Denkfehler. Habe ich aber mit der nächsten Version gefixt.

Wie bereits gesagt, bisher kommt man nur mit der Escape Taste raus, ich bin noch hin und hergerissen, wie man das etwas gescheiter und vor allem intuitiver lösen kann.

1. Ein weiterer Button, am besten rechts oben (wirkt dann allerdings etwas zugerümpelt)
2. Eine kurze Nachricht "Esc-Taste zum Verlassen des Vollbildmodus" - also wie bei Youtube
3. Beides

Was meint ihr?
lg, Janik
Benutzeravatar
Janik
Mitglied
 
Beiträge: 168
Registriert: 07.10.2008, 09:01

Re: Stretchbox

Beitragvon creativecreation am 28.09.2011, 21:46

ich bin es gewohnt intuitiv immer alle vollbild modi mit der esc taste zu schließen, da bin ich wohl auch nicht der einzige ... deswegen würde ich sagen, dass diese kurze nachricht vollkommen ausreicht ;)
Benutzeravatar
creativecreation
Mitglied
 
Beiträge: 312
Registriert: 26.10.2010, 10:44
Wohnort: Ulm

Nächste

Zurück zu Homepage

Wer ist online?

Mitglieder in diesem Forum: 0 Mitglieder und 1 Gast