ce_slider: navigation anpassen

Hi,

ich müßte die 'ce_slider_controls_elements' anpassen. Jetzt find ich kein Template, in dem diese UL-Tags mit den A-Tags
drin sind.

Kann mir jemand helfen?

Über CSS schaff ich´s net, ich brauch die Navi ohne Ziffern und trotzdem ne Klick-Möglichkeit.

Gruß
Michel

Das HTML-Markup steht im Template "ce_slider_html.tpl" und das CSS in "ce_slider_css.tpl".

Hallo,

danke für deine Antwort. Dort hab ich schon geschaut, da ist aber die UL-Liste nicht drin.

Die such ich...
.. die wird bestimmt dynamisch eingefügt, sonst wär sie ja im Template drin. Im JS find ich sie auch net, dann wird´s wohl in einer PHP-Datei
generiert..

Ich müßte als Navi-Icons einfach Quadrate mit sw. Rand machen, das aktive zusätzlich weiss gefüllt: Anhang 5767

Gruß
Michel

Doch, die unsortierte Liste gib's dort:

PHP-Code:

---

  <?php if($this->Controls && $this->Controls_Elements): ?>               
      <div id="ce_slider_controls_elements">
              <ul><li class="ce_slider_nav_hide">Navigation</li></ul>
      </div>
  <?php endif; ?>

---

Und ja, die Buttons werden dann über das JavaScript im Template "ce_slider_js.tpl" in diese Liste eingefügt.

Hi,

ich such aber die Liste mit den Ankern. Die <ul> aus´m Tempalte oben drüber mein ich net, weiß gar net wozu die gut ist...

der A-Tag ist halt immer drin und spreizt den <li>, so dass ich nix g´scheit anpassen kann. Sogar die active-Klasse bekommt nur
der <a>, so kann ich nicht mal was anderes bedingt formatieren.

Klappt net, scheiße.

Gruß
Michel

Auch wenn du es schon herausbekommen haben solltest: die <li> findest du in der Datei /plugins/ce_slider/ce_slider.js ab ca. Zeile 144:

Code:

---

// -- Number nav setup
if(self.options.numNavActive == true){
       
        //------------------------------------------------------------------------------ NEW
        //create numbered navigation boxes, and insert into the 'num_nav' ul)
        var numItem = new Element('li', {id: 'num'+i});
        var numLink = new Element('a', {
                'onclick': 'return false;',
                'href': self.options.pageLink + '#anchor'+i,
                'class': 'numbtn',
                'html': self.options.navContent[i]
        });

---

Kannst du natürlich ändern, ist aber nicht updatesicher.

Danke michelb für die nachträgliche Info.

Grüßla

Hallo,

ich suche eine Möglichkeit die Nummern unter der grafischen Navigation auszublenden.
Momentan wird mir im Firefox unter den grafischen Punkten keine Zahl angezeigt, aber im Chrome wird mir untern den Punkten die Nummern angezeigt.

Wo kann ich nur die Nummern ausblenden nicht aber die Grafiken?

Danke

Gruß
Christian

Hi,

ich habe genau das selbe Problem mit Chrome, dass die Nummern unter den grafischen Punkten eingeblendet werden. In allen anderen Browsern tauchen sie nicht auf.

Noch eine andere Frage: Kann man die grafischen Navigationspunkte auch durch echte Grafiken austauschen?

Grüße, Sim

Moin,

ich hab das über css gelöst und habe folgendes in die css datei eingefügt:

Code:

---

#ce_slider_controls_elements li a}
background: url("tl_files/images/slider_off.png") no-repeat scroll center center transparent;
}

#ce_slider_controls_elements li a:hover, #ce_slider_controls_elements li a:focus, #ce_slider_controls_elements a.active{
background: url("tl_files/images/slider_on.png") no-repeat scroll center center transparent;
}

---

Hoffe das hilft

Gruß
Christian

Hi Christian,

vielen Dank! Dein CSS funktioniert wunderbar, und jetzt werden endlich schöne Navi-Buttons angezeigt. :)
Aber leider werden bei mir in Chrome immer noch die Zahlen angezeigt. In IE7 werden die Buttons auch in der Höhe abgeschnitten. Das war aber auch schon vorher so (vor dem einsetzen von Grafiken).

Hallo das hab ich jetzt auch rausgefunden:

ändere in der ce_slider_css.xhtml oder erstelle ein eigenes template wegen der updatesicherheit.
Dann passt du das noch etwas an deine Bedürfnisse an.

Code:

---

#ce_slider_controls_elements li a
        {
          display: inline-block;
          font-size: 0;
          height: 11px;
          margin: 1px 3px;
          width: 16px;
          background-color:transparent;
          background: transparent url(tl_files/images/slider_off.png) center center no-repeat;         
        }
               
        #ce_slider_controls_elements li a:hover,
        #ce_slider_controls_elements li a:focus,
        #ce_slider_controls_elements a.active
        {
          background: transparent url(tl_files/images/slider_on.png) center center no-repeat;
        }

<?php if($this->Controls_Elements == 'graphic'): ?>
        #ce_slider_controls_elements li a
        {
          font-size:0;
        }
        <?php endif; ?>

---

Gruß
Christian

Super! Jetzt funktioniert wirklich alles tadellos!! :)

Vielen Dank für deine tolle Hilfe!