php-resource



Zurück   PHP-Scripte PHP-Tutorials PHP-Jobs und vieles mehr > Entwicklung > HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS
 

Login

 
eingeloggt bleiben
star Jetzt registrieren   star Passwort vergessen
 

 

 


HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS Probleme mit HTML5, Bootstrap oder jQuery ?

Antwort
 
LinkBack Themen-Optionen Bewertung: Bewertung: 1 Stimmen, 5,00 durchschnittlich.
  #1 (permalink)  
Alt 05-02-2010, 22:04
gmf2
 Registrierter Benutzer
Links : Onlinestatus : gmf2 ist offline
Registriert seit: Feb 2010
Beiträge: 5
gmf2 befindet sich auf einem aufstrebenden Ast
Standard [Gelöst] jquery - slider.js erweitern

Hallo Forengemeinde,

ich versuche nun schon seit Stunden ein Sliderscript zu erweitern. Ich möchte, dass das derzeit aktive Panel die zugehörige div-class sichtbar macht, also Quasi einen Textbereich unter dem Slider, der bei jeder Grafik eben verschieden ist und einen festen Bezug zur "aktiven" Grafik darstellt.

Der HTML Code eines Panels sieht so aus:
HTML-Code:
<div class="panel" id="panel_1">
   <div class="inside">
   <img src="inc/rota/images/01.jpg" alt="" />
   <h2>Überschrift</h2>
   <p> <a href="example.php">... verlinkte Unterschrift ...</a></p>
   </div>
  </div>
Jetzt würde ich gerne noch sowas wie
PHP-Code:
<div class="detail" id="panel_1"><?php include "detailtext1.php" ?>
<div class="detail" id="panel_2"><?php include "detailtext2.php" ?>
<div class="detail" id="panel_3"><?php include "detailtext3.php" ?>
 usw.
einfügen, aber immer nur den Detailtext includen, dessen Panel gerade "aktiv" ist.

Und genau hier bin ich mit meinem Latein am Ende, wie kann die Panel-ID o.ä. abfragen?, bzw. nur das detail_panel_x sichtbar machen?

Mein slider.js hab ich noch angehängt.

Grüße gmf2
Angehängte Dateien
Dateityp: txt slider.js.txt (3,3 KB, 160x aufgerufen)

Geändert von gmf2 (06-02-2010 um 20:42 Uhr)
Mit Zitat antworten
  #2 (permalink)  
Alt 06-02-2010, 13:51
Kropff
  Administrator
Links : Onlinestatus : Kropff ist offline
Registriert seit: Mar 2002
Ort: Köln
Beiträge: 11.722
Kropff befindet sich auf einem aufstrebenden Ast
Standard

Du denkst falsch herum. Zuerst wird PHP ausgeführt und dann JavaScript. Da ist also nichts mit includen. Warum arbeitest du nicht einfach mit display:none?

Peter
__________________
Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
Meine Seite
Mit Zitat antworten
  #3 (permalink)  
Alt 06-02-2010, 17:21
gmf2
 Registrierter Benutzer
Links : Onlinestatus : gmf2 ist offline
Registriert seit: Feb 2010
Beiträge: 5
gmf2 befindet sich auf einem aufstrebenden Ast
Standard

Danke für die Antwort!,
das hab ich mir mittlerweile fast auch so zusammengereimt, allerdings fehlt mir ein Ansatz, wie ich im display:none das Aktive, und nur das aktive Panel einblenden lassen kann.

Die anderen Panel sind ja auch noch sichtbar, allerdings durch das slide.js verkleinert, mein Ansatz war daher soetwas in dieser Art im slider.js:

PHP-Code:
...
    function 
growBigger(element) {
        $(
element)
            .
animate({ widthcurWidth })
            .
find("img")
            .
animate({ widthcurImgWidth })
            .
end()
            .
find("h2")
            .
animate({ fontSizecurTitleSize })
            .
end()
            .
find("p")
            .
animate({ fontSizecurParSize });
            $(
"div.detail").show(); // Wie kann ich hier nach der Pannelnummer unterscheiden, 
            // bzw. nur den Detailbereich anzeigen lassen, der gerade "growBigger" ist?
}
... 
Die geammte slider.js hatte ich ja schon angehängt, wäre für einen Denkanstoß sehr dankbar, da jquery neu für mich ist und ich es gerne verstehen würde - arbeite mich quasi gerade ein.

Grüße
Mit Zitat antworten
  #4 (permalink)  
Alt 06-02-2010, 17:28
Kropff
  Administrator
Links : Onlinestatus : Kropff ist offline
Registriert seit: Mar 2002
Ort: Köln
Beiträge: 11.722
Kropff befindet sich auf einem aufstrebenden Ast
Standard

Also mit jQuery kenne ich mich kaum aus. Ich programmier so was per Hand. Wie wird denn das aktive Panel überhaupt definiert?

Peter
__________________
Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
Meine Seite
Mit Zitat antworten
  #5 (permalink)  
Alt 06-02-2010, 17:42
gmf2
 Registrierter Benutzer
Links : Onlinestatus : gmf2 ist offline
Registriert seit: Feb 2010
Beiträge: 5
gmf2 befindet sich auf einem aufstrebenden Ast
Standard

Schade, da sind wir dann wohl schon zwei, wobei ich grundsätzlich erst beginne, mich mit Javascripten auseinander zu setzen; hab vorher "nur" PHP, SQL, HTML und bash geschrieben,

Das Startpannel welches standartmäßig aufgerufen wird steht in Zeile 113
PHP-Code:
    growBigger("#panel_3");    
    var 
curPanel 3
Und dann werden die "Nachbarpannels" per Addition/Subtraktion bestimmt:
PHP-Code:
    $("#panel_"+(curPanel+1)).click(function(){ change(true); });
    $(
"#panel_"+(curPanel-1)).click(function(){ change(false); });
    
    
//when the left/right arrows are clicked
    
$(".right").click(function(){ change(true); });    
    $(
".left").click(function(){ change(false); }); 
Gerade weil ich mich damit noch nicht wirklich auskenne, kommen mir dabei immer solche Gedanken wie, einfach die aktive Panel ID irgendwie abzufragen und später den Zusatz drunter zu hängen, dass die aktive ID eben ein "show" ist und alles andere auf "hide" bleibt.

Ob dieser Ansatz mit jquery überhaupt so machbar ist, hab ich noch nicht rausgefunden.

Geändert von gmf2 (06-02-2010 um 17:44 Uhr)
Mit Zitat antworten
  #6 (permalink)  
Alt 06-02-2010, 17:48
Kropff
  Administrator
Links : Onlinestatus : Kropff ist offline
Registriert seit: Mar 2002
Ort: Köln
Beiträge: 11.722
Kropff befindet sich auf einem aufstrebenden Ast
Standard

Dann hast du also die Variable curPanel, in der die Nummer des aktiven Panels gespeichert ist. Also musst du vom Prinzip her so vorgehen.
PHP-Code:
<div class="detail" id="panel_1" style="display: none;">...</div>
<
div class="detail" id="panel_2" style="display: none;">...</div>
<
div class="detail" id="panel_3" style="display: none;">...</div>
...
document.getElementById('panel_' curPanel).style.display 'block'
Allerdings kann ich dir an dieser Stelle nicht weiter helfen, da wie schon gesagt, meine jQuery-Kenntnisse äußerst bescheiden sind.

Peter
__________________
Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
Meine Seite

Geändert von Kropff (06-02-2010 um 17:55 Uhr) Grund: Rechtschreibfehler
Mit Zitat antworten
  #7 (permalink)  
Alt 06-02-2010, 17:53
gmf2
 Registrierter Benutzer
Links : Onlinestatus : gmf2 ist offline
Registriert seit: Feb 2010
Beiträge: 5
gmf2 befindet sich auf einem aufstrebenden Ast
Standard

Hm, okay - erstmal danke für den Ansatz!

Ich werds versuchen und dann berichten.
Mit Zitat antworten
  #8 (permalink)  
Alt 06-02-2010, 19:06
gmf2
 Registrierter Benutzer
Links : Onlinestatus : gmf2 ist offline
Registriert seit: Feb 2010
Beiträge: 5
gmf2 befindet sich auf einem aufstrebenden Ast
Standard

Noch eine kurze Frage,
geh ich richtig in die Anahme, deine "document.getElementById - Zeile" mit in die growBigger Funktion packen zu können, da diese ja beim wechsel durchlaufen wird?, wenn ja wie müsste da die Zeile aussehen?

EDIT:
Vielen Dank!
,
Dein Ansatz funktioniert! habs hinbekommen.


Geändert von gmf2 (06-02-2010 um 20:41 Uhr)
Mit Zitat antworten
  #9 (permalink)  
Alt 11-02-2010, 17:25
wono
 Registrierter Benutzer
Links : Onlinestatus : wono ist offline
Registriert seit: Oct 2009
Beiträge: 32
wono befindet sich auf einem aufstrebenden Ast
Standard

Wenn ich dich richtig verstanden habe dann kannst du allem div einen display:none geben dann mit jquery arbeiten und das anzeigen lassen was aktiv ist.

Wenn das irgenwie ein link oder button ist der aktiv wird kannst dir ja ne Variable setzten die du einfach abfrägst und wenn die Variable z.B == 1 ist änderst du über jquery das display:none des ersten divs.

Weiß allerdings nicht ob das zu 100% mit deinem Problem übereinstimmt.
Mit Zitat antworten
Antwort

Lesezeichen


Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)
 

Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
jQuery appen() IE& XGremliN HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS 1 11-09-2009 18:05
JQuery MTCook HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS 6 21-01-2009 21:22
slider geht nur einmal richtig q-skyrunner PHP Developer Forum 0 10-12-2008 08:19
Photo Slider .elementrio HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS 6 03-03-2008 22:47
slider ruckelt bei firefox alternative gesucht sanktusm HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS 2 01-04-2007 14:09

Themen-Optionen
Thema bewerten
Thema bewerten:

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are an


PHP News

ebiz-trader 7.5.0 mit PHP7 Unterstützung veröffentlicht
ebiz-trader 7.5.0 mit PHP7 Unterstützung veröffentlichtDie bekannte Marktplatzsoftware ebiz-trader ist in der Version 7.5.0 veröffentlicht worden.

28.05.2018 | Berni

Wissensbestand in Unternehmen
Wissensbestand in UnternehmenLebenslanges Lernen und Weiterbilden sichert Wissensbestand in Unternehmen

25.05.2018 | Berni


 

Aktuelle PHP Scripte

PHP Server Monitor

PHP Server Monitor ist ein Skript, das prüft, ob Ihre Websites und Server betriebsbereit sind.

11.09.2018 Berni | Kategorie: PHP/ Security
PHP WEB STATISTIK ansehen PHP WEB STATISTIK

Die PHP Web Statistik bietet Ihnen ein einfach zu konfigurierendes Script zur Aufzeichnung und grafischen und textuellen Auswertung der Besuchern Ihrer Webseite. Folgende zeitlichen Module sind verfügbar: Jahr, Monat, Tag, Wochentag, Stunde Folgende son

28.08.2018 phpwebstat | Kategorie: PHP/ Counter
Affilinator - Affilinet XML Produktlisten Skript

Die Affilinator Affilinet XML Edition ist ein vollautomatisches Skript zum einlesen und darstellen der Affili.net (Partnerprogramm Netzwerk) Produktlisten und Produktdaten. Im Grunde gibt der Webmaster seine Affilinet PartnerID ein und hat dann unmittelb

27.08.2018 freefrank@ | Kategorie: PHP/ Partnerprogramme
 Alle PHP Scripte anzeigen

Alle Zeitangaben in WEZ +2. Es ist jetzt 15:29 Uhr.