Hallo zusammen!
Ich habe die Vorlage "Madrid" schon fast komplett nach meinen Wünschen umgearbeitet. Nur in einem Bereich komme ich einfach nicht weiter...
Wenn ich mit der Maus über das Untermenü fahre, wird ja der Text etwas nach rechts eingerückt, was auch ok ist. Nun möchte ich gerne dass das so bleibt wenn man noch auf der Seite ist.
Ich kenne es, dass diese ganzen Anpassungen mit a:link a:hover a:active und a:viseted macht. Leider finde ich den Abschnitt im Code aber nicht.
Mag mal bitte jemand gucken, wo sich das versteckt? Oder wird das bei der Vorlage anderes gemacht (ich hoffe nicht)?
Danke

https://undnochmalrumprobieren.jimdo.com/%C3%BCber-mich/

Inzwischen habe ich herausgefunden, dass der Punkt den ich gerne im Menü ändern möchte scheinbar gar nicht mit CSS geschrieben wurde, sondern mit java-script. Das stelle mich vor extreme Probleme. Kann mit jemand sagen was ich wo tun muss, damit der Text eingerückt bleibt, solange ich noch auf der Seite bin (in CSS würde das ja "active" sein)?

Sorry, da ich schon wieder am rumprobieren bin, geht das sowieso nicht mehr.

Ich habe das jetzt schon hin wie ich möchte, nur eine Sache fehlt mir noch:
https://undnochmalrumprobieren.jimdo.com/%C3%BCber-mich/

Am linken Rand habe ich ja noch ein Untermenü. Ich wünsche mir, das wenn man die Seite hochscrollt, dass das Menü dann oben am Rand stehen bleibt und nicht mit wegscrollt.
Nun habe ich ein passendes Script gefunden und im HEAD-Bereich eingegeben. Aber ich scheine irgendwo noch einen Fehler zu haben, denn es klappt nicht.
Ich suche nun schon seit gestern immer wieder, probiere alles möglich aus, aber ich kann den Fehler nicht finden.

<script type="text/javascript">
//<![CDATA[
$(document).ready(function() {
  $(function() {
    var offset = $("#jtpl-section-aside").offset();
    var topPadding = 35;
    var topMargin = 20;
    var animateSpeed = 200;
    $(window).scroll(function() {
      if ($(window).scrollTop() > offset.top) {
        $("#jtpl-section-aside).stop().animate({
          marginTop: $(window).scrollTop() - offset.top + topPadding
        },animateSpeed);
      } else {
        $("#jtpl-section-aside").stop().animate({
          marginTop: topMargin
        },animateSpeed);
      }
    }); // END window scroll
  }); // END function
}); // END document ready    
//]]>
</script>
 
 

<style type="text/css">
/*<![CDATA[*/
.jtpl-section-aside {
    width: 250px;
}
.jtpl-section-aside.fixed {
    position: fixed;
    top: 20px;
}
/*]]>*/
</style>
 
 

Ich habe jetzt schon wieder so viel versucht, bestimmt den halben Tag dran gesessen...
Bitte schaut direkt auf der HP nach wie der Code jetzt genau steht. Das oben geschriebene ist schon nicht mehr aktuell.
Ich verstehe einfach nicht warum das Menü nicht stehen bleibt.

Suuuuuuuuuuuper, jetzt klappt es. DANKE Dir!

Aber jetzt noch mal für mich:
Lag es jetzt nur an der Einbindung? (hatte da auch schon rumprobiert)
Und was meinst Du mit "es geht auch ohne jQuery"? Mit CSS?

Hm...
Ich habe von dem Befehl "Sticky" als CSS gelesen. Aber um das so umzusetzen sollte ich etwas in meinem Firefox ändern. Das habe ich da aber nicht gefunden und der ist aktuell.
Aber so klappt das ja jetzt auch.

Moin,

ich hab es nun auch endlich geschafft, den Code da unten zu verbasteln, klappt auch gut (am Desktop), allerdings
flackert die Navigation beim Scrollen auf dem iPad sehr unschön. Hab schon mit der animateSpeed
rumgespielt, nützte aber nichts. Weiß jemand, wie man das Flackern verhindert?

Zitat von az_ im Beitrag #6

---

...dazu brauchst Du kein jQuery.

Aber bei Dir stimmt schon mal die Einbinung nicht. so ist es richtig:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js" type="text/javascript">
</script>
 
<script>
//<![CDATA[
$(document).ready(function() {
  $(function() {
    var offset = $(".jtpl-section-aside").offset();
    var topPadding = 35;
    var topMargin = 20;
    var animateSpeed = 200;
    $(window).scroll(function() {
      if ($(window).scrollTop() > offset.top) {
        $(".jtpl-section-aside").stop().animate({
          marginTop: $(window).scrollTop() - offset.top + topPadding
        },animateSpeed);
      } else {
        $(".jtpl-section-aside").stop().animate({
          marginTop: topMargin
        },animateSpeed);
      }
    }); // END window scroll
  }); // END function
}); // END document ready
//]]>
</script>
 

LG, az

---

aaah, ich sollte dazu schreiben, dass ich .jtpl-section-aside durch .jtpl-navigation ersetzt habe.
Und, ich hab es erstmal wieder deaktiviert, da ich meinen Besuchern das störende Flackern nicht zumuten mag.

hier wird das Problem ganz gut geschildert, und ich verliere die Hoffnung auf eine Lösung:

https://yootheme.com/support/question/103653

da flackert nichts, aber der Balken wird durch die Animation breiter, was ich als unnötig empfinde.
Kann man aber sicher verhindern.
Am liebsten hätte ich ja sowas wie hier: https://playgroundinc.com/ (gefunden über line25.com),
aber soweit bin ich noch nicht ;-)