[TYPO3-german] OT ... Ankernavigation bei einem fixen header

[Rainer Schleevoigt]

On 8/19/11 3:09 PM, Ralf-Rene Schröder wrote:
> Hallo...
> ich habe gerade ein Problem beim Anspringen von Ankern (Contentelementen)

scheint ein reines JS-Problem zu sein. Ich würde Dir raten, ein JS-Teil 
zu nehmen, was sanft hinscrollt, dann kannst Du es dort auch 
manipulieren. Das reine <a href=#marker tut es nicht.


So etwa:

$(document).ready(function()  {

    $('a[href*=#]').click(function()  {

       // skip SmoothScroll on links inside sliders or scroll boxes also using anchors or if there is a javascript call
       if($(this).parent().attr('class')=='scrollable_navigation'  ||  $(this).attr('href').indexOf('javascript')>-1)  return;

       // duration in ms
       var  duration=1000;

       // easing values: swing | linear
       var  easing='swing';

       // get / set parameters
       var  newHash=this.hash;
       var  oldLocation=window.location.href.replace(window.location.hash,  '');
       var  newLocation=this;

       // make sure it's the same location
       if(oldLocation+newHash==newLocation)
       {
          // get target
          var  target=$(this.hash+', a[name='+this.hash.slice(1)+']').offset().top;

          // adjust target for anchors near the bottom of the page
          if(target>  $(document).height()-$(window).height())  target=$(document).height()-$(window).height();  

          // set selector
          if($.browser.safari)  var  animationSelector='body:not(:animated)';
          else  var  animationSelector='html:not(:animated)';

          // animate to target and set the hash to the window.location after the animation
          $(animationSelector).animate({  scrollTop:  target},  duration,  easing,  function()  {

             // add new hash to the browser location
             window.location.href=newLocation;
          });

          // cancel default click action
          return  false;
       }
    });

});



Brauchst dann och dies EASING-lib.

Rainer
>
> wenn ich einen Anker direkt anspringe (oder auch über eine
> Contentsitemap), dann springt die Seite dorthin dass das entsprechende
> Contenelement am oberen rand des Viewports sitzt (soweit eigentlich OK)...
> nun habe ich aber einen fix positionierten header am oberen Rand
> und das CE ist damit zum Teil dahinter verschwunden
> gibt es sowas wie ein Offset was für das Anspringen eines Ankers
> eingestellt werden kann, damit die Anzeige immer z.B.120px unter dem
> oberen Rand startet?
> oder gibt es für so einen Fall ein JS was helfen könnte, denn mit CSS
> scheit mir keine Lösung zu greifen.
>
> jemand eine Idee ???
>
> eine Beispielseite liegt hier:
> http://if_ready2go.if-20.com/index.php?id=114#c426
>
>


-- 
Dipl.-Ing. Rainer Schleevoigt
Webmasterei Hamburg
iPhone/Android Developer
Certified TYPO3 Integrator
22303 Hamburg
Novalisweg 10