HTH-C.com - Forum
Latest News Latest Threads
Neuerung: Persönliche Galerie
Informationen zur Übernahme der Erweite..
HTH Blog - Version 2.0
#HTH.Systems - Betatester gesucht
Neueröffnung - PHPKit-Award.de
HTH Webchat v3
Letzter Beitrag Happy Birthday Bottyline Weiblicher Benutzer Heute, 0:00 Zeit der letzten Antwort
Letzter Beitrag PHPKit 1.6.6 Treffnix Männlicher Benutzer 14.03.2024 - 05:20 Zeit der letzten Antwort
Letzter Beitrag Gibt es eigentlich noch jemand der PHPki.. Treffnix Männlicher Benutzer 14.03.2024 - 05:19 Zeit der letzten Antwort
Letzter Beitrag Herzlich Willkommen Botty Männlicher Benutzer 22.02.2024 - 12:50 Zeit der letzten Antwort
Letzter Beitrag PHPKit 1.6.6 ohne ASCE auf PHP8x Myrddin Männlicher Benutzer 22.03.2023 - 12:36 Zeit der letzten Antwort
 53.399 Posts & 4.945 Themen in 78 Foren
Forenübersicht » Support / Hilfe » PHPKit 1.6.4 & 1.6.5 & 1.6.6 » Styles » dropdown

dropdown
23 Beiträge in diesem Thema
 Seiten (2):    1     2    Next    >  
10.09.2011 - 14:11 Uhr
Beitrag: #1
würde folgendes gerne in mein kit einbauen:

http://www.kit-spiele.de/?path=forumsthread&threadid=1320

hat jemand erfahrung damit? welche dateien muss ich ändern??

 
Zum Anfang der Seite
10.09.2011 - 20:01 Uhr
Beitrag: #2
Steht das nicht da?

#1
Lad die .js-Datei runter, klick

#2
Packe diese ins Root-Verzeichnis. Das ist dort, wo die include.php ist.

#3
Geh in Admin > Sonstiges > Vorlagen > **Dein Design** und öffne den Eintrag mit den Namen site.
Sollte dieser nicht existieren, wähle oben Standardvorlagen (Schreibgeschützt) aus. Öffne dort die site und wähle beim Vorlagenpack (oben rechts) dann dein Design aus. Und speichern.

Danach suchst du folgendes:



1

PHP-Quelltext

</head>
Und fügt davor / darüber das ein:



1
2
3
4
5
6
7

PHP-Quelltext

<script type="text/javascript" src="dropdowncontent.js">
/***********************************************
* Drop Down/ Overlapping Content- © Dynamic Drive (www.dynamicdrive.com)
* This notice must stay intact for legal use.
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/
</script>
#4
Jetzt wählst du ein beliebes Template (bzw. Vorlage) aus. Dort definierst du nun den Bereich, der das macht, was du einbauen möchtest.
In den Thread ist ein Beispiel gesetzt. Pack diesen Code z.B. einfach mal in das Template profile ganz am Anfang.

Danach gehst du in dein Profil, wo alle möglichen Links zu den Einstellungen sind.

 
Zum Anfang der Seite
12.09.2011 - 13:26 Uhr
Beitrag: #3
in meinem fall wäre es die hauptnavigation (oben) wo ich das dropdown haben möchte. ich weiß jedoch nicht in welche datei des vorlagenpakets ich den code einbiden soll.

 
Zum Anfang der Seite
12.09.2011 - 17:16 Uhr
Beitrag: #4
Versuch mal folgendes:

Öffne via. Admin > Sonstiges > Vorlagen im Vorlagenpack Standardvorlagen (Schreibgeschützt) die Vorlage
navigation/content_hl_top und navigation/content_box_sub_top und speichere diese in dein derzeitiges Design. Dazu einfach beim geöffneter Vorlage ganz rechts oben bei Vorlagenpaket den Namen ändern und speichern.

Sollte bereits eines / beide Vorlagen vorhanden sein: Backup machen. Beispielweise den Namen der Vorlagen im deinen Design ändern.

Nachdem das erledigt ist:
Die nun neu gespeicherten Vorlagen in deinen Design öffnen und folgendes eintragen:

navigation/content_hl_top



1
2
3
4
5

PHP-Quelltext

<li class="pkcontent_hl_$navalign">
    <
a id="hiddenBox_$navboxidrel="hiddenBox_$navboxid">
        <
h3>$nav_headline</h3>
    </
a>
</
li>
navigation/content_box_sub_top



1
2
3
4
5
6
7

PHP-Quelltext

<div id="hiddenBox_$navboxidstyle="position:absolute; visibility: hidden;">
    <
div id="$navboxid">
        <
ul class="pkcontent_box_sub_$navalign">
$navigation_body
        
</ul>
    </
div>
</
div>
Ich weiss aber nicht, ob es funktioniert. Theoretisch müsste es.

 
Zum Anfang der Seite
13.09.2011 - 16:51 Uhr
Beitrag: #5
nein funktioniert leider nicht. wie habt ihr denn das hier gelöst? genau so sollte es ein und nicht anders.

 
Zum Anfang der Seite
13.09.2011 - 18:27 Uhr
Beitrag: #6
Okay, hab mal ein bisschen rumprobiert.

Sofern es weiterhin dieses js-Script sein soll, solltest du wie folgt vorgehen:

Lösche folgendes geänderte Template im Adminbereich, damit das Standard-Template benutzt wird:
navigation/content_hl_top

Öffne jetzt im Adminbereich das Template navigation/content_box_sub_top und ersetze es hiermit:



1
2
3
4
5
6
7
8
9
10
11

PHP-Quelltext

<div id="pkncidRel$navcat[navigationcat_id]style="position:absolute; visibility: hidden; z-index: 100; border: 9px solid orange; background-color: white; width: 300px; padding: 8px;">
    <
div id="$navboxid">
        <
ul class="pkcontent_box_sub_$navalign">
$navigation_body
        
</ul>
    </
div>
</
div>

<
script type="text/javascript">
dropdowncontent.init("pkncid$navcat[navigationcat_id]""left"100'mouseover');
</
script>
Nun öffne die Datei pkinc/publicinc/navigation.php und suche das:



1

PHP-Quelltext

$nav_headline pkHtmlLink($link,$title,$target,'pkncid'.$navcat['navigationcat_id'],'pkcontent_hl_'.$navalign);
Füge direkt darunter das ein:



1

PHP-Quelltext

$nav_headline str_replace('id="pkncid'.$navcat['navigationcat_id'].'"''id="pkncid'.$navcat['navigationcat_id'].'" rel="pkncidRel'.$navcat['navigationcat_id'].'"'$nav_headline);
Funktioniert bei mir ohne Probleme.

---

Ist aber ein blödes Script. Zumal es auch Möglichkeiten gibt, die ohne JS auskommen (was abschaltbar ist).
Und wie WEBI es hier gelöst hat: Keine Ahnung. Ist aber JS.

 
Zum Anfang der Seite
14.09.2011 - 13:42 Uhr
Beitrag: #7
sehr gut, danke. funktioniert zu 80%. das problem ist: das dropdown öffnet sich erst nach anklicken des links. mir ist klar, das man das in den einstellungen der navbox ändern kann. wenn ich dort allerdings "immer offen" einstelle, dann hab ich kein dropdown.

edit//

ok das funktioniert jetzt ohne anklicken.

aber mit der formatierung funktionierts nicht so ganz. ich hab jetzt versucht das ganze mit eigenen navboxen zu lösen, das funktioniert aber auch nicht ganz. was mich stört ist 1. der gelbe rahmen (wie bekomme ich diesen weg?) und 2. der abstand. das menü soll gleich unter dem link beginnen und nicht mit einem abstand von 50px oder so.

http://www.xup.in/dl,19548630/ddmen.jpg/

Dieser Beitrag wurde bereits 7 mal editiert, zuletzt von crasher91 - 14.09.2011 - 14:23 Uhr
 
Zum Anfang der Seite
14.09.2011 - 18:45 Uhr
Beitrag: #8
Öffne das Template navigation/content_box_sub_top in Adminmenu. In der ersten Zeile steht ja das:



1

PHP-Quelltext

<div id="pkncidRel$navcat[navigationcat_id]style="position:absolute; visibility: hidden; z-index: 100; border: 9px solid orange; background-color: white; width: 300px; padding: 8px;">
Du kannst nun entscheiden, wie du es gern hättest:
#1 Darstellungseigenschaften im Template, so wie jetzt
#2 Im Design-Menu die Eigenschaften eintragen.

---

#1
Diesen Teil bearbeiten:



1

PHP-Quelltext

border9px solid orangebackground-colorwhitewidth300pxpadding8px;
Den Rest davor solltest lieber lassen, da dieser für den eigentlichen Ablauf sind.

---

#2
Diesen Teil



1

PHP-Quelltext

 style="position:absolute; visibility: hidden; z-index: 100; border: 9px solid orange; background-color: white; width: 300px; padding: 8px;"

durch diesen ersetzen



1

PHP-Quelltext

class="jsBox"
Dann im Design-Menu (Admin > Sonstiges > Design > **Dein Design**) im großen Feld folgendes eintragen:



1
2
3
4
5
6
7
8
9
10
11

PHP-Quelltext

div.jsBox
    
{
    
position:                absolute;
    
visibility:              hidden;
    
z-index:                 100;

    
background:              white;
    
border:                  9px solid orange;
    
width:                   300px;
    
padding:                 8px;
    }
Sofern du nicht in CSS bewandert bist, kannst auch eine kleine Beschreibung (o. Bild) posten. Dann kann ich versuchen es danach anzupassen.

Was die bescheidene Position angeht .. Keine Ahnung. Kann dir nur eine Variante sagen, wo die .js-Datei bearbeitet werden müsste.
Wenn das okay ist, dann öffne die dropdowncontent.js und suche das:



1

PHP-Quelltext

var horizontaloffset=(subobj.dropposition[0]=="left")? -(subobj.offsetWidth-anchorobj.offsetWidth) : //calculate user added horizontal offset
Dort siehst du das:
-(subobj.offsetWidth-anchorobj.offsetWidth)

Ersetze dies durch z.B -500
Dieser Wert muss nicht stimmen. Da einfach mal rumprobieren.

 
Zum Anfang der Seite
14.09.2011 - 19:53 Uhr
Beitrag: #9
ok ich nähere mich immer dem endergebnis zwinkern

also das problem, warum es so weit unten war hat mit dem dekorationsbereich zu tun.

folgendes: wenn ich bei meinem design "Höhe des oberen Dekorationsbereichs" 50px oder andere werte eintrage sieht das ganze so aus:

http://www.xup.in/dl,83539277/dd3.jpg/

stelle ich beim dekorationsbereich 0px ein, dann sieht es so aus:

http://www.xup.in/dl,76199267/dd2.jpg/

wie du siehst ist das ganze zwar in der richtigen position, aber das ganze verschiebt sich nach links. weiß leider nicht wo und was ich ändern muss.

über das problem, das der dekorationsbereich 0 ist könnte ich schlimmsten falls hinwegsehen. ich hätte es allerdings trotzdem gerne, das ich von oben ca. 50px nach unten gehen kann. wenn es anders nicht möglich ist kann ich nix machen.

für die jetzige hilfe schon mal ein großes danke!

 
Zum Anfang der Seite
14.09.2011 - 20:24 Uhr
Beitrag: #10
Du könntest erstmal dem JS-Script paar Infos geben. Beispielweise kannst du im Template navigation/content_box_sub_top im Adminbereich (Admin > Sonstiges > Vorlagen) folgenes suchen:



1
2
3

PHP-Quelltext

<script type="text/javascript">
dropdowncontent.init("pkncid$navcat[navigationcat_id]""left"100'mouseover');
</
script>
Dort steht ja als 2. Parameter left. Ändere dies mal in left-top um. Sollte das keine (erwünschte) Wirkung zeigen, musst du wohl oder übel die .js-Datei bearbeiten. Oder ein anderes Script benutzen, was mehr freiheiten hat.

Wie bereits gesagt, suche das:



1

PHP-Quelltext

var horizontaloffset=(subobj.dropposition[0]=="left")? -(subobj.offsetWidth-anchorobj.offsetWidth) : //calculate user added horizontal offset
Und ändere diesen Teil um: -(subobj.offsetWidth-anchorobj.offsetWidth)
Beispielweise in: --400

Für die Höhe dann dies:



1

PHP-Quelltext

var verticaloffset=(subobj.dropposition[1]=="top")? -subobj.offsetHeight anchorobj.offsetHeight //calculate user added vertical offset
Und ändere diesen Teil um: -subobj.offsetHeight[/red]
Beispielweise in: +40

Bevor ich es vergesse: Damit die 2 Änderungen wirken, muss im obige Änderung im Template sein.

Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von k!r!ka - 14.09.2011 - 20:27 Uhr
 
Zum Anfang der Seite
15.09.2011 - 13:31 Uhr
Beitrag: #11
jaaa...perfekt. jetzt funktioniert das ganze so wie ich mir das vorgestellt habe.
herzlichen dank!
warst mir eine sehr große hilfe.

edit//
ein minimales problem vielleicht noch. ist es irgendwie möglich die zeit einzustellen, wie lang das dropdown offen ist wenn man nicht mit der maus drin ist? zB so 500ms.

und noch ein problem ist, das ich das ganze nicht formatieren kann. habs bereits mit klassen und allem versucht. aber da lässt sich nix ändern. egal wie groß ich die tabelle mache.

Dieser Beitrag wurde bereits 2 mal editiert, zuletzt von crasher91 - 16.09.2011 - 14:48 Uhr
 
Zum Anfang der Seite
21.09.2011 - 13:10 Uhr
Beitrag: #12
ok ich habe jetzt etwas anderes gefunden, das meiner meinung nach einfach sein sollte einzubauen.

http://lwis.net/free-css-drop-down-menu/dropdown.simple.horizontal.html

siehs dir mal an und sag mir dann bitte deine meinung dazu.

 
Zum Anfang der Seite
21.09.2011 - 17:37 Uhr
Beitrag: #13
Ist gewiss besser als über JS zu regeln (abschaltbar). Auch sind es nur ein paar Zeilen CSS-Code, was auch gut ist.

Wenn du damit klar kommst, spricht nichts gegen (was so oder so nichts gegen spricht ;>).

 
Zum Anfang der Seite
22.09.2011 - 10:55 Uhr
Beitrag: #14
mein problem ist halt wieder...wie baue ich das ganze in mein kit ein?^^

edit//

ok ich habs jetz geschafft das ganze einzubauen. hab folgendes gemacht:

die datei navigation/content_hl_top mit folgendem ersetzt:

Hier klicken zum aufklappen


dann hab ich noch die beiden css-dateien, die du im head siehst in mein design eingebunden.

hat auch funktioniert, allerdings folgendes problem:

http://www.xup.in/dl,92286046/ddmen2.jpg/

in der dropdown.css ist nicht viel zu ändern denke ich.

Hier klicken zum aufklappen


eher wird es hier sein. hab schon etwas herumprobiert, aber ich komme einfach nicht dahinter.

Hier klicken zum aufklappen


ich glaube im speziellen hier:

Hier klicken zum aufklappen


was könnte ich da ändern?

Dieser Beitrag wurde bereits 2 mal editiert, zuletzt von k!r!ka - 22.09.2011 - 16:42 Uhr
 
Zum Anfang der Seite
22.09.2011 - 17:37 Uhr
Beitrag: #15
Zitat
Original geschrieben von crasher91

mein problem ist halt wieder...wie baue ich das ganze in mein kit ein?^^



So wie du das gemacht hast, ist sowieso .. naja, Blödsinn. Wenn du die ganzen Navigation statisch machen willst, sollte das lieber in die Admin > Sonstiges > Vorlagen > **Dein Design** > site rein.
Und Haupt-Tags (ich nenn es mal so) werden immer nur einmal genutzt. Dazu gehört der -Tag. Dieser ist ja schon am Anfang gesetzt.

Wenn du es statisch, also fest haben willst, musste du den Code von der CSS-Navi in oben genanntes Template einspeisen. Und in selben Template siehst du ja auch den -Bereich.
Darein kommen dann die 2 -CodeBlöcke.




Wenn du es allerdings dynamisch, mit Sichtbarkeitsrechten etc., also intern im Adminbereich verwalten möchtest, musste so vorgehene:

###

Öffne Admin > Sonstiges > Vorlagen > **Dein Design** > site (bzw. aus Original-Datei darein kopieren) und suche das:
Hier klicken zum aufklappen


Und ersetze es hiermit:
Hier klicken zum aufklappen


###

Öffne nun Admin > Sonstiges > Vorlagen > **Dein Design** > navigation/content_box_sub_top (bzw. aus Original-Datei darein kopieren) und ersetze es komplett hiermit:



1
2
3

PHP-Quelltext

<ul>
$navigation_body
</ul>
###

Öffne nun Admin > Sonstiges > Vorlagen > **Dein Design** > navigation/content_hl_top (bzw. aus Original-Datei darein kopieren) und ersetze es komplett hiermit:



1
2
3
4

PHP-Quelltext

<li class="dir">
    <
h3>$nav_headline</h3>
    
$navigation_sub_top
</li>
###
###

Öffne nun die pkinc/publicinc/navigation.php und suche das:



1
2
3
4

PHP-Quelltext

        if(!empty($navigation_body))
            {
            eval(
"\$navigation_sub_top.=\"".pkTpl("navigation/content_box_sub_".$navalign)."\";");
            }
Füge darüber das ein:



1

PHP-Quelltext

unset($navigation_sub_top); #for css-nav top
###

Suche weiter nach dem:



1

PHP-Quelltext

$navigation_top '<ul class="pkcontent_box_top">'.$navigation_top.'</ul>';
Und ersetze es hiermit:



1

PHP-Quelltext

#$navigation_top = '<ul class="pkcontent_box_top">'.$navigation_top.'</ul>';
###

Suche nun weiter:



1

PHP-Quelltext

$nav_headline str_replace('id="pkncid'.$navcat['navigationcat_id'].'"''id="pkncid'.$navcat['navigationcat_id'].'" rel="pkncidRel'.$navcat['navigationcat_id'].'"'$nav_headline);

(das ist die eine Änderung wegen der anderen Navigation, mit den JS.)

Und entferne diese Zeile komplett.


Damit sollte auch dein CSS-Problem behoben sein.

Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von k!r!ka - 23.09.2011 - 20:06 Uhr
 
Zum Anfang der Seite
 Seiten (2):    1     2    Next    >  

Ähnliche Themen
 
Support Support » Vertikales Dropdown Menu - Letzte Antwort von k!r!ka am 03.05.13, 16:31 Vertikales Dropdown Menu  (03.05.13, 16:31)

HTH-C.com - Webmedien & Community