javascript<\/p>\n
JQuery<\/a> har en praktisk funktion prototyp animate<\/strong> som tar de f\u00f6rsta slutliga CSS-<\/a> egenskaperna som den f\u00f6rsta parametern och hastigheten som den andra parametern t.ex. "snabb", "l\u00e5ngsam" eller det angivna tidsintervallet. Den tredje parametern \u00e4r en valfri \u00e5teruppringning efter att animeringen \u00e4r f\u00e4rdiga.<\/p>\n P\u00e5 min personliga webbplats<\/a> har jag nyligen designat om sidans outlook f\u00f6r att g\u00f6ra den helt mobilanv\u00e4ndarv\u00e4nlig<\/a>. Det finns tv\u00e5 l\u00e4nkar p\u00e5 fasta positioner p\u00e5 sk\u00e4rmen, "Navigering" och "Topp".<\/p>\n Navigeringsmenyn \u00e4r placerad efter sidans huvudinneh\u00e5ll, och d\u00e4rf\u00f6r skulle du beh\u00f6va definiera en div<\/strong> med t.ex. id=’navigera’. L\u00e4gg sedan till f\u00f6ljande JQuery<\/a> -kod.<\/p>\n Du skulle f\u00f6rst beh\u00f6va definiera ett ankare med t.ex<\/p>\n Placera detta direkt efter och l\u00e4gg till f\u00f6ljande JQuery<\/a> -kod:<\/p>\n skrolla<\/p>\nvar properties = { color: red; };\n$('div').animate(properties, \"fast\", function() {});<\/code><\/pre>\nNavigering<\/h3>\n
$(\"a[href='#navigate']\").click(function(){\n\u00a0 \u00a0 $(\"html, body\").stop().animate(\n\u00a0 \u00a0 \u00a0 \u00a0 {scrollTop:$(\"div#navigate\").offset().top}, \"slow\");\n\u00a0 \u00a0 \u00a0 \u00a0 return false;\n\u00a0 \u00a0 })\n});<\/code><\/pre>\nTopp<\/h3>\n
<a name='top'><\/a><\/code><\/pre>\n$(\"a[href='#top']\").click(function(){\n\u00a0 \u00a0 $(\"html, body\").stop().animate(\n\u00a0 \u00a0 \u00a0 \u00a0 {scrollTop:0}, \"slow\");\n\u00a0 \u00a0 \u00a0 \u00a0 return false;\n\u00a0 \u00a0 })\n});<\/code><\/pre>\n