![]() |
|
Off-Topic Hier ist die allgemeine Plauder-Ecke. Alles, was sonst nirgends reinpasst kommt hier rein |
![]() |
|
Themen-Optionen | Ansicht |
![]() |
#1 |
Administrator
Registriert seit: 07.03.2008
Ort: 3. Bit Links hinter dem Kernel
Alter: 49
Beitr?ge: 9.638
Abgegebene Danke: 1.121
Erhielt 4.499 Danke für 458 Beiträge
Downloads: 18
Uploads: 9 Nachrichten: 2257 Renommee-Modifikator:
10 ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() |
![]()
Hallo liebe "Nörgel-Gemeinde"
![]() Ich wurde vor ein paar Wochen hilfesuchend gebeten, einer Studentin bei ihrem Abschluß-Projekt zu helfen. In ihrer Ausbildung haben die Lehrkräfte offensichtlich ihren eigenen Lehrplan "vergessen" und das Projekt komplett an die Wand gefahren. Im Klartext: Künstler ohne jeglichen Bezug zum Web soll eine komplett funktionierende Seite erstellen Und das mal locker flockig 3 Monate vor Projekt-Abgabe (Prüfungs- / Abschlussrelevant) Leider wurde sie (über 3 Ecken) erst 1 Woche vor Abgabe zu mir geschickt .... Also haben wir das ganze mit einer so "heißen Nadel" gestrickt, wie ich das so noch nie gemacht habe ... Den Code habe komplett ich erzeugt -- Sie hatte die "künstlerische Leitung" und den Inhalt ![]() Und das ist herausgekommen: Josephine Scheibe Als sie vor einigen Tagen "Abgabe" hatte, hat das Projekt einen durchschlagenden Erfolg erzielt. Sie ist die einzige ihres kompletten Jahrgangs, die wirklich ein funktionierendes Projekt hatte. Auch ist Sie die einzige, die nun wirklich eine Webseite hat ..... Ob der Qualität und der Funktion haben wir sogar ihren "vorlauten" Lehrer mudtot gemacht ![]() Das nenn ich mal nen Erfolg :P Zur Technik: Aktuell sockelt alles auf JavaScript, da das Projekt komplett Offline-Fähig sein muß. Als Kern wird ausschließlich jQuery genutzt. Enthalten ist ein Form-Validator und ein URL-Parser (Damit Direkt-URLs auch zum Ziel führen). Der Gesamte Inhalt wird dynamisch über ein JS-Array geladen, erzeugt und gerendert. Es gibt im Grunde keinen festen Code - die Bestückung kann sich daher stetig ändern ohne Eingriff in den Code. In dem Sinne -- Feedback ist auch hier natürlich gewünscht PS: 100%ige Mobiltauglichkeit
__________________
Fragen gehören ins Forum - und NICHT in mein Postfach ! Ich erteile KEINEN Privatunterricht über e-mail und PN ! Hackliste Br. NV nach Threadstarter u. Aktualität <--+--> Liste Hacks Bereich NV Alphabethisch Ge?ndert von Cerberus (22.04.2016 um 08:04 Uhr) |
![]() |
![]() ![]() ![]() |
Folgende 6 Benutzer sagen Danke zu Cerberus für den nützlichen Beitrag: | dontcha ![]() ![]() |
![]() |
#2 | |||||||||||
König
Registriert seit: 15.10.2008
Beitr?ge: 1.923
Abgegebene Danke: 23
Erhielt 571 Danke für 38 Beiträge
Downloads: 8
Uploads: 0 Nachrichten: 4155 Renommee-Modifikator:
7256 ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() |
![]()
die Lightbox ist nicht responsive wie der rest
![]()
__________________
|
|||||||||||
![]() |
![]() ![]() ![]() |
![]() |
#3 |
Administrator
Registriert seit: 07.03.2008
Ort: 3. Bit Links hinter dem Kernel
Alter: 49
Beitr?ge: 9.638
Abgegebene Danke: 1.121
Erhielt 4.499 Danke für 458 Beiträge
![]() Downloads: 18
Uploads: 9 Nachrichten: 2257 Renommee-Modifikator:
10 ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() |
![]()
Ich weiß ...
Es muß ja aber "abgabefähig" sein ... daher ist manches nicht "hochoptimiert"
__________________
Fragen gehören ins Forum - und NICHT in mein Postfach ! Ich erteile KEINEN Privatunterricht über e-mail und PN ! Hackliste Br. NV nach Threadstarter u. Aktualität <--+--> Liste Hacks Bereich NV Alphabethisch |
![]() |
![]() ![]() ![]() |
![]() |
#4 | |||||||||||
König
Registriert seit: 15.10.2008
Beitr?ge: 1.923
Abgegebene Danke: 23
Erhielt 571 Danke für 38 Beiträge
Downloads: 8
Uploads: 0 Nachrichten: 4155 Renommee-Modifikator:
7256 ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() |
![]()
ach und das ist nicht abgabefähig
![]() Code:
/** * Ermittelt die aktuell mögliche Position des Funktions-Inhaltes * Diese Funktion wird am Ende der Menü-Bewegung aufgerufen * * @return null */ function setContentPosition() { var breiteNavbar = $('#nav-container').width(), breiteDocument = $(document).width() ; // Galerie-Position setzen, Text-Position setzen if (breiteDocument > mobileStyle) { $('#content, #content2').css({ 'left': parseInt(breiteNavbar - 100) + 'px', 'width': '70%' }); } else { $('#content, #content2').css({ 'left': '0px', 'width': '100%' }); } } /** * Erzeugung der Hauptnavigations als UL-Objekt * Es wird unterschieden, ob der Eintrag ein Link * oder ein Hilfsobjekt ist * * @return null */ function iniMenu() { // Galiern laden und entsprechend anzeigen $.each(navigation, function(index, value) { if (index.length) { // Teilstring ermitteln (Link oder nicht) var teil = index.substring(0, 5); if (teil == 'dummy') { $('#navigation').append('<li class="trenner"><span>' + value + '</span></li>'); } else { var loader = 'page', infotext, Css ; if (value['info'].length) { infotext = ' title="' + value['info'] + '"'; } if (value['class'].length) { Css = ' class="' + value['class'] + '"'; } if (value['type'] == 'galery') { loader = 'galery'; } $('#navigation').append('<li class="link" id="nav-' + index + '">' + '<a href="javascript:void(0);" onclick="loadContent' + '(\'' + index + '\', \'' + loader + '\')' + '"' + infotext + Css + '>' + value['name'] + '</a>' + '</li>'); } } }); } /** * Inhalt in den Hauptbereich laden * Je nach Modus werden entweder die Galerien oder eine HTML-Seite angezeigt * Der inaktive Content wird auf Default zurückgesetzt * * @param String zu ladender Inhalt beim Klicken * @param String 'galery' oder 'page' * @return null */ function loadContent(type, mode) { if (mode == undefined) { // Wenn der Modus unbekannt ist, dann abbrechen return; } // Je nach Modus die Container definieren var ziel = $('#content2'), old = $('#content') ; if (mode == 'galery') { ziel = $('#content'); old = $('#content2'); } if ($('#mobile-nav li').length > 0) { $('#mobile-nav').fadeOut('fast'); } // inaktiven Container ausblenden old.fadeOut('fast'); if (type.length) { // Navigation ist Mittig? dann nach links bewegen if (firstRun == 0) { // Navigation bewegen moveNavigation(type, mode); // Inhalt setzen setContentPosition(); // Inhalt wartet, bis die Navigation links angekommen ist ziel.delay(runtimeNav); } else { // Navigations-Status prüfen setNavigationStatus(); } // Die Seite nur laden, wenn sich der Klick geändert hat und der Modus definiert ist if (type != lastType && mode != undefined) { $('#nav-' + lastType + ' a').removeClass('active'); // Inhalt ausblenden und firsch laden ziel.fadeOut('fast', function() { // inaktiven Container zusätzlich unsichtbar machen old.css('display', 'none'); // Inhalt aus Config.js laden if (mode == 'galery') { old.html(''); getInhalt2Content(type); } else { old.load('./pages/lightbox.htm'); ziel.load('./pages/' + type + '.htm'); } // Inhalt anzeigen ziel.fadeIn('fast'); $('#nav-' + type + ' a').addClass('active'); lastType = type; }); } } else { alert('Content-Type <' + type + '> not available'); } } /** * Bilder aus dem Config-Array in die Gallerie laden * * @return null */ function getInhalt2Content(type) { // Galerie erzeugen $('#content').html('<div class="image-set"></div>'); var $imageSet = $('.image-set'); $.each(data[type], function(index, value) { var info; // Prüfen, ob in Info etwas enthalten ist if (value['info'].length) { info = '<br />' + value['info']; } // Bild erzeugen var image = '<a href="data/big/' + value['image'] + '" class="image-link" ' + 'data-title="' + value['titel'] + info + '" data-lightbox="' + type + '-set">' + '<img src="./data/thumb/' + value['thumb'] + '" class="image-thumb" title="' + value['titel'] + '" />' + '</a>'; // erzeugtes Bild an die Galie anhängen $imageSet.append(image); }); }
__________________
|
|||||||||||
![]() |
![]() ![]() ![]() |
![]() |
#5 |
Administrator
Registriert seit: 07.03.2008
Ort: 3. Bit Links hinter dem Kernel
Alter: 49
Beitr?ge: 9.638
Abgegebene Danke: 1.121
Erhielt 4.499 Danke für 458 Beiträge
![]() Downloads: 18
Uploads: 9 Nachrichten: 2257 Renommee-Modifikator:
10 ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() |
![]()
nö
![]() jaja -- du hast ja recht *grmpf
__________________
Fragen gehören ins Forum - und NICHT in mein Postfach ! Ich erteile KEINEN Privatunterricht über e-mail und PN ! Hackliste Br. NV nach Threadstarter u. Aktualität <--+--> Liste Hacks Bereich NV Alphabethisch |
![]() |
![]() ![]() ![]() |
![]() |
#6 | |||||||||||
Profi
Registriert seit: 06.12.2008
Ort: Oberhausen/Die Macht am Niederrhein
Alter: 62
Beitr?ge: 689
Abgegebene Danke: 115
Erhielt 139 Danke für 18 Beiträge
Downloads: 175
Uploads: 0 Nachrichten: 2 Renommee-Modifikator:
1216 ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() |
![]()
Super Arbeit.
![]() ![]()
__________________
![]() |
|||||||||||
![]() |
![]() ![]() ![]() |
![]() |
#7 | |||||||||||
König
Registriert seit: 15.10.2008
Beitr?ge: 1.923
Abgegebene Danke: 23
Erhielt 571 Danke für 38 Beiträge
Downloads: 8
Uploads: 0 Nachrichten: 4155 Renommee-Modifikator:
7256 ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() |
![]()
warum arbeitest du bei der Navi nicht auch mit Media Querys wie beim Kontaktformular? Dann sparst du dir dafür das Javascript geraffel
__________________
|
|||||||||||
![]() |
![]() ![]() ![]() |
![]() |
#8 |
Administrator
Registriert seit: 07.03.2008
Ort: 3. Bit Links hinter dem Kernel
Alter: 49
Beitr?ge: 9.638
Abgegebene Danke: 1.121
Erhielt 4.499 Danke für 458 Beiträge
![]() Downloads: 18
Uploads: 9 Nachrichten: 2257 Renommee-Modifikator:
10 ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() |
![]()
werde ich wahrscheinlich auch so umbauen ...
hab gerade das "geflacker" der Hintergründe abgeschaltet ... und dabei noch nen "Logik-Bug" ausgebügelt ... Parameters laufen nun auch "smootie" ![]() Werde erst mal schauen, was die "Kundin" dazu sagt und wie es genau weiter entwickelt wird ....
__________________
Fragen gehören ins Forum - und NICHT in mein Postfach ! Ich erteile KEINEN Privatunterricht über e-mail und PN ! Hackliste Br. NV nach Threadstarter u. Aktualität <--+--> Liste Hacks Bereich NV Alphabethisch |
![]() |
![]() ![]() ![]() |
![]() |
#9 | |||||||||||
Neuling
Registriert seit: 03.05.2016
Beitr?ge: 15
Abgegebene Danke: 0
Erhielt 0 Danke für 0 Beiträge
Downloads: 0
Uploads: 0 Nachrichten: 0 Renommee-Modifikator:
0 ![]() |
![]()
Also, ich bin sehr unerfahren und leicht zu beeindrucken - aber für mit der heißen Nadel gestrickt ist das sehr schick finde ich.
Für jemanden der gar keine Ahnung hat (wie die Tutoren anscheinend) wahrscheinlich eine Offenbarung ![]()
__________________
Willst du den Charakter eines Menschen erkennen, so gib ihm Macht. Abraham Lincoln |
|||||||||||
![]() |
![]() ![]() ![]() |
![]() |
Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, G?ste: 1) | |
|
|