---
title: "Jquery: ScrollTo-funktion med namnade länkar"
type: "forum-thread"
url: "https://www.webforum.nu/amne/javascript/184790-jquery-scrollto-funktion-med-namnade-länkar"
topic: "JavaScript"
topic_url: "https://www.webforum.nu/amne/javascript"
author: "bikic"
published: "2010-10-04T10:47:39.000Z"
updated: "2010-10-06T07:38:37.000Z"
replies: 11
views: 1065
page: 1
pages: 1
language: "sv-SE"
site: "webForum — webforum.nu"
rights: "Upphovsrätten till varje inlägg tillhör dess författare."
attribution: "Citera som: webForum, https://www.webforum.nu/amne/javascript/184790-jquery-scrollto-funktion-med-namnade-länkar"
---

# Jquery: ScrollTo-funktion med namnade länkar

## #1 — bikic, 2010-10-04T10:47Z

Hej,

om jag har en sida som heter webforum/test med flera namnade länkar, exempelvis #niklas

Om jag från en annan sida vill länka till just niklas så länkar jag så här: webforum/test/#niklas

Än så länge fungerar det fint, vad som händer är att jag kommer direkt till sidan där niklas börjar.

Men jag har sett på sidor (kommer inte ihåg de nu) att man scrollas ner från toppen till sin namnade länk.

Jag har hittat en liknande funktion, men den fungerar inte med länkar från andra sidor. <http://mix26.com/demo/local_scroll/index.html>

Jag har dock testar med detta men får det inte till att fungera, någon ser problemet?

```
var elem = $('#' + window.location.hash.replace('#', ''));
    	if(elem) {
         	$.scrollTo(elem.left, elem.top);
	}
```

Permalänk: https://www.webforum.nu/p/184790

## #2 — voigtann1, 2010-10-04T11:06Z

elm är ett jquery objekt, left och top finns inte i jquery, left och top som funktioner finns, är det det du är ute efter?
eller kör jquerys position(): <http://api.jquery.com/position/>

Permalänk: https://www.webforum.nu/p/2255934

## #3 — bikic, 2010-10-04T11:36Z

Får inte riktigt till det. Jag har ju ett enkelt script för animate, men får inte riktigt till det med location.hash. Hur kan jag få det att scrolla ner till min anchor?

```

$('html, body').animate({scrollTop: '0px'}, 300);
```

Permalänk: https://www.webforum.nu/p/2255937

## #4 — voigtann1, 2010-10-04T11:39Z

vad har du för kod idag då du vill implementera? eller du vill ha en kod som ta och animera från start? Vilket plugin använder du?

Att skapa animationen vet jag inte ens om det är möjligt spontant, för när sidan hittar sitt ankare så gå den ner dit by default (utan javascript) så jag vet inte ens om det är möjligt att fixa för att skriva över vad webbläsaren gör by default.

<http://mix26.com/demo/local_scroll/index.html#contact>

ser du att den inte animera heller.

Permalänk: https://www.webforum.nu/p/2255938

## #5 — bikic, 2010-10-04T11:40Z

När jag skriver in webforum/test/#niklas i browsern så hamnar jag direkt på #niklas.

Vad jag vill är att den ska visa toppen först och sedan scrolla ner till #niklas. Jag vet bara inte hur jag får till det, har sökt hela förmiddagen ;)

Permalänk: https://www.webforum.nu/p/2255940

## #6 — voigtann1, 2010-10-04T11:44Z

> **[bikic skrev:](https://www.webforum.nu/p/1518732)**
>
> När jag skriver in webforum/test/#niklas i browsern så hamnar jag direkt på #niklas.
>
> Vad jag vill är att den ska visa toppen först och sedan scrolla ner till #niklas. Jag vet bara inte hur jag får till det, har sökt hela förmiddagen ;)

> Att skapa animationen vet jag inte ens om det är möjligt spontant, för när sidan hittar sitt ankare så gå den ner dit by default (utan javascript) så jag vet inte ens om det är möjligt att fixa för att skriva över vad webbläsaren gör by default.

Har aldrig haft intresset att kolla upp detta men jag gissar på att det inte gå att "hindra" default beteendet på detta.

Det du kan göra är att inte länkar till id="niklas" eller en \<a name="niklas"\> utan gå mot något annat och scrollar till den.

Permalänk: https://www.webforum.nu/p/2255941

## #7 — bikic, 2010-10-04T11:52Z

Om du visar mig hur jag lokaliserar anchor name så kanske jag kan klura ut resten.

Om sidan har ett anchorname så ska den göra detta...

Permalänk: https://www.webforum.nu/p/2255943

## #8 — voigtann1, 2010-10-04T11:57Z

ett ankare är ju #niklas

\<a name="niklas"\>...\</a\>

och \<span id="niklas"\>...\</span\> är "samma" sak när det gäller ankare.

Du kan ju försöka att vid varje sidladdning så skrollar du upp högst upp på sidan (utan någon animation) och sen kör du animeringen ner till #niklas.

Permalänk: https://www.webforum.nu/p/2255944

## #9 — voigtann1, 2010-10-04T12:39Z

```
var elem = $('#' + window.location.hash.replace('#', ''));
if(elem) {
	var position = elem.position();
	$('html, body').animate({scrollTop:0}, 0).animate({scrollTop:position.top}, 500);
}
```

demo:
<http://voigt.se/sandbox/scrollTo/#about>

Är det detta du vill skapa?

Permalänk: https://www.webforum.nu/p/2255946

## #10 — bikic, 2010-10-05T10:46Z

Exakt! Fast detta ska kunna fungera med att man länkar från en annan sida men det gör inte detta. Att fixa en scroll på namnade länkar på en sida är en baggis, men att få den att först lokalisera toppen och sedan scrolla ner till den namnade länken är en gåta.

Permalänk: https://www.webforum.nu/p/2255987

## #11 — voigtann1, 2010-10-05T11:25Z

Det gör den ju, du kan inte få in logiken från din sida till min (om jag inte själv kör samma skript).

Kan du komma med ett exempel och berätta vad du vill att det skall göra? fattar inte alls vad du vill göra.

Permalänk: https://www.webforum.nu/p/2255988

## #12 — bikic, 2010-10-06T07:38Z

Tack! Det fungerade.

Jag la även in en timeout så att den inte scrollar ner direkt.

```

// Scroll to anchors

	var elem = $('#' + window.location.hash.replace('#', ''));

	if(elem) {
		var position = elem.position();
		$('html, body').scrollTop(0);
		setTimeout(function(){
			$('html, body').animate({scrollTop:position.top}, 1000);
		}, 750);
	}
```

Permalänk: https://www.webforum.nu/p/2256037

---

Tråden på webben: https://www.webforum.nu/amne/javascript/184790-jquery-scrollto-funktion-med-namnade-länkar