Bitte geben Sie einen Grund für die Verwarnung an
Der Grund erscheint unter dem Beitrag.Bei einer weiteren Verwarnung wird das Mitglied automatisch gesperrt.
Jimdo Button als Anker

Ich Versuche einen Jimdo-Button als Anker zu benutzen mit folgendem Code:
2
3
4
5
<div id="cc-m-11427268297" class="j-module n j-callToAction "><div class="j-calltoaction-wrapper j-calltoaction-align-1">
<a class="j-calltoaction-link j-calltoaction-link-style-1" data-action="button" href="#Anker-Name" target="_blank" data-title="Jetzt mehr erfahren">
Jetzt mehr erfahren </a>
</div>
</div>
Leider öffnet sich der Anker dann immer in einem neuen Tab und scrollt nicht einfach zum Anker.
Wie kann ich das lösen?

Ich habe auch ein Matrix-Theme installiert welches schon ein Javascript nutzt, da kriege ich den scroll animation code auch nicht zum laufen:
2
3
Code-Snippets und Skripte von Matrix-Theme bitte nicht hier posten, die sind copyright-geschützt.

Dein Code ist richtig. Du könntest Ihn aber verbessern:
2
3
4
5
6
7
8
9
10
11
12
<div id="mybutton1" class="j-module n j-callToAction ">
<div class="j-calltoaction-wrapper j-calltoaction-align-1">
<a class="j-calltoaction-link j-calltoaction-link-style-1" data-action="button"
href="#Anker-Name"
target="_self" data-title="Jetzt mehr erfahren">Jetzt mehr erfahren</a>
</div>
</div>
Was Du jetzt noch brauchst, ist der Anker selbst - ein Stück weiter auf der Seite:
2
3
4
5
<div id="Anker-Name" class="anker">
</div>
class="anker" ist die Klasse für die Sprungmarke, die kannst Du z.B. absolut positionierenund mit negativem margin ausstatten, wenn Du die Navigation brücksichtigen musst.
target="_self" bleibt auf der aktuellen Seite, target="_blank" öffnet einen neuen Tab im Browser.
LG, az
Achtung: Code im Forum bitte am besten mit der Schaltfläche für "Code" einkapseln!!! (= ) , oder den Code in Formatierungs-Klammern setzen (...zwischen "code" und "/code", jeweils in eckigen Klammern).
Achtung! Im neuen Layout ist die Formatierungsleiste versteckt! Klick auf das Smiley rechts oben über dem Text-Editorfenster, um die Formatierungssymbole einzublenden!
...und zuletzt: Bitte sendet mir keine privaten Nachrichten über das Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de
Wenn Ihr mich sucht, hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de
Spenden: Hier könnt Ihr unser Userforum finanziell unterstützen: page-644478-1.html

Jetzt klappt der Anker, aber wie kriege ich die scroll animation hin?
Wenn ich den Code von dem Jimo-Tutorial nehme für die OnePage Seiten, klappen meine Matrix-Themes widgets nicht mehr:
Code vom Jimdo Tutorial:
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<script type="text/javascript">
//<![CDATA[
$(function() {
$('a[href*=#]:not([href=#])').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
if (target.length) {
$('html,body').animate({
scrollTop: target.offset().top
}, 1000);
return false;
}
}
});
});
//]]>
</script>


Habs hinbekommen, einfach jeden Code probiert den ich finden konnte.
Mit dem hat es geklappt:
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<script type="text/javascript">
//<![CDATA[
jQuery(function($) {
$(document).ready(function(){
$('a[href^="#"]').on('click',function (e) {
e.preventDefault();
var target = this.hash;
$target = $(target);
$('html, body').stop().animate({
'scrollTop': $target.offset().top //no need of parseInt here
}, 900, 'swing', function () {
window.location.hash = target;
});
});
});
}(jQuery));
//]]>
</script>

...das ist ein guter Tipp für alle, die Matrix Themes benutzen!
Achtung: Code im Forum bitte am besten mit der Schaltfläche für "Code" einkapseln!!! (= ) , oder den Code in Formatierungs-Klammern setzen (...zwischen "code" und "/code", jeweils in eckigen Klammern).
Achtung! Im neuen Layout ist die Formatierungsleiste versteckt! Klick auf das Smiley rechts oben über dem Text-Editorfenster, um die Formatierungssymbole einzublenden!
...und zuletzt: Bitte sendet mir keine privaten Nachrichten über das Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de
Wenn Ihr mich sucht, hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de
Spenden: Hier könnt Ihr unser Userforum finanziell unterstützen: page-644478-1.html

- Allgemeines
- Regeln für die Benutzung des Forums
- HowToDo ( = so geht´s)
- Jimdo User-Forum
- Eure Jimdo-Webseiten - Vorstellungsrunde
- Bugs, Workarounds und Anregungen
- Jimdo-Elemente
- Allgemeines
- Jimdo-Shop
- Jimdo-Specials (Tools, Widgets, HTML und CSS)
- Suchmaschinenoptimierung (SEO)
- Sonstiges
- Tutorials
- "OffTopic"-Themen
- "Übernahme" von Beiträgen aus dem offiziellen Jimdo-Forum...
- Nutzungsbedingungen und Haftungsausschluss
- Jimdo-Blog
Ähnliche Themen
Jetzt anmelden!
Jetzt registrieren!