Re: OP_Accordion Template - Links zu den einzelnen Punkten
Posted: Tue Nov 17, 2020 8:42 pm
Hat funktioniert!
Danke für den wirklich tollen Support
Danke für den wirklich tollen Support
Welcome to the CMSimple_XH–Community!
https://cmsimpleforum.com/
Jetzt habe ich doch noch eine Lösung gefunden/erarbeitet. Das hätte den Vorteil, dass das Akkordeon durch das öffnen per Anker-ID nicht beeinträchtigt wird, also ganz normal funktioniert, sich alle Seiten schließen lassen usw..
Code: Select all
// 20.11.2020 if URL contains anchor link uncheck matching checkbox (open Accordion))
$(document).ready(function() {
var url = $(location).attr('href');
// get part of url after last slash
var oppageID = url.substr(url.lastIndexOf("/")+1);
// uncheck checkbox
$(oppageID).closest('div').find(':checkbox').prop('checked',false);
// scroll to top
setTimeout(function() {
theOffset = $(oppageID).offset();
$('body,html').animate({ scrollTop: theOffset.top - 66 }); // offset from top
}, 400); // time delay before scrolling begins, in ms
});
Code: Select all
// Remove anchor link in URL after Timeout
setTimeout(()=>{
// uses HTML5 history API to manipulate the location bar
history.replaceState('', document.title, window.location.origin + window.location.pathname + window.location.search);
}, 3000); // ... millisecond timeout in this case
Interessante Lösung! Allerdings sollte man den Timeout vielleicht besser möglichst kurz halten (wenn überhaupt ein Timeout nötig ist). Ich habe nämlich gerade die Demoseite aufgerufen, und wollte dann in der Addressleiste zu Seite 3 wechseln, aber plötzlich war das URL-Fragment verschwunden.lck wrote: ↑Sat Nov 21, 2020 12:49 pmWenn dich dann noch der verbleibende Anker in der URL stört (also www.example.com/#Changelog), diesen könnte man mit dem Code entfernen. Einfach an obigen Code darunter anfügen.Code: Select all
// Remove anchor link in URL after Timeout setTimeout(()=>{ // uses HTML5 history API to manipulate the location bar history.replaceState('', document.title, window.location.origin + window.location.pathname + window.location.search); }, 3000); // ... millisecond timeout in this case
Dachte erst das muss unbedingt sein, ansonsten würde der hash in der URL gelöscht bevor die checkbox unchecked ist. Ist aber nicht so, geht auch ohne Timeout-Einstellung, siehe Demo.
Hm, verstehe jetzt nicht ganz genau du damit meinst, das soll ja auch verschwinden. Prinzipiell wird ja kein anchor Link in der URL angezeigt. Diese Anpassung dient lediglich externer Links zum direkten Anspringen eines bestimmten Akkordeonzweiges, der Inhalt sollte dabei auch sichtbar gemacht werden.
Ich hatte es aber zunächst gesehen, und wollte nur die "4" am Ende durch "3" ersetzen, und als ich Backspace drückte, war plötzlich das ganze URL-Fragment weg. War etwas seltsam für mich.
Ich finde es, so wie es jetzt ist, gut.
Hi Ick,lck wrote: ↑Sat Nov 21, 2020 12:49 pmJetzt habe ich doch noch eine Lösung gefunden/erarbeitet. Das hätte den Vorteil, dass das Akkordeon durch das öffnen per Anker-ID nicht beeinträchtigt wird, also ganz normal funktioniert, sich alle Seiten schließen lassen usw..
Wenn du das auch mal testen willst, so entferne den eingefügten Code aus der stylesheet.css wieder und füge in der template.htm vor dem schließenden </script> Tag (am Ende der Datei), folgendes ein:Wenn dich dann noch der verbleibende Anker in der URL stört (also www.example.com/#Changelog), diesen könnte man mit dem Code entfernen. Einfach an obigen Code darunter anfügen.Code: Select all
// 20.11.2020 if URL contains anchor link uncheck matching checkbox (open Accordion)) $(document).ready(function() { var url = $(location).attr('href'); // get part of url after last slash var oppageID = url.substr(url.lastIndexOf("/")+1); // uncheck checkbox $(oppageID).closest('div').find(':checkbox').prop('checked',false); // scroll to top setTimeout(function() { theOffset = $(oppageID).offset(); $('body,html').animate({ scrollTop: theOffset.top - 66 }); // offset from top }, 400); // time delay before scrolling begins, in ms });
Code: Select all
// Remove anchor link in URL after Timeout setTimeout(()=>{ // uses HTML5 history API to manipulate the location bar history.replaceState('', document.title, window.location.origin + window.location.pathname + window.location.search); }, 3000); // ... millisecond timeout in this case
Hi Ick!lck wrote: ↑Sat Nov 21, 2020 12:49 pmJetzt habe ich doch noch eine Lösung gefunden/erarbeitet. Das hätte den Vorteil, dass das Akkordeon durch das öffnen per Anker-ID nicht beeinträchtigt wird, also ganz normal funktioniert, sich alle Seiten schließen lassen usw..
Wenn du das auch mal testen willst, so entferne den eingefügten Code aus der stylesheet.css wieder und füge in der template.htm vor dem schließenden </script> Tag (am Ende der Datei), folgendes ein:Wenn dich dann noch der verbleibende Anker in der URL stört (also www.example.com/#Changelog), diesen könnte man mit dem Code entfernen. Einfach an obigen Code darunter anfügen.Code: Select all
// 20.11.2020 if URL contains anchor link uncheck matching checkbox (open Accordion)) $(document).ready(function() { var url = $(location).attr('href'); // get part of url after last slash var oppageID = url.substr(url.lastIndexOf("/")+1); // uncheck checkbox $(oppageID).closest('div').find(':checkbox').prop('checked',false); // scroll to top setTimeout(function() { theOffset = $(oppageID).offset(); $('body,html').animate({ scrollTop: theOffset.top - 66 }); // offset from top }, 400); // time delay before scrolling begins, in ms });
Code: Select all
// Remove anchor link in URL after Timeout setTimeout(()=>{ // uses HTML5 history API to manipulate the location bar history.replaceState('', document.title, window.location.origin + window.location.pathname + window.location.search); }, 3000); // ... millisecond timeout in this case
Das war ja erst gar nicht angefragt, es ging nur um den Link #Changelog von externen Seiten. Aber wenn's dir so passt, super .