---
title: "Pilen på telia?"
type: "forum-thread"
url: "https://www.webforum.nu/amne/javascript/87653-pilen-på-telia"
topic: "JavaScript"
topic_url: "https://www.webforum.nu/amne/javascript"
author: "Jesper T"
published: "2003-10-04T23:06:11.000Z"
updated: "2003-10-06T11:20:35.000Z"
replies: 15
views: 413
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/87653-pilen-på-telia"
---

# Pilen på telia?

## #1 — Jesper T, 2003-10-04T23:06Z

Med risk för felpostning.
För ett tag sedan så hade telia en liten pil som gled in från sidan när man hovrade över länkarna i menyn.
Har någon sätt något liknande script?
Crossbrowser.

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

## #2 — Nexus86, 2003-10-04T23:09Z

De hade gjort detta i Flash men hittar du ett javascript som fungerar så posta gärna en länk. :)

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

## #3 — Jesper T, 2003-10-04T23:13Z

Har för mig att det var dhtml men, men....
Jag får leta vidare.

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

## #4 — bossse, 2003-10-05T09:28Z

Kanske det var nåt i stil med detta då?

```
<HTML>
<head> 
<style> 
<!-- 
#slidemenubar, #slidemenubar2{position:absolute; border:1.5px solid blue; background-color:silver; 
layer-background-color:#188410; font:bold 12px Verdana; line-height:20px; } 
body {background-color:green; color:yellow}
A:link {text-decoration: none;color: lightgreen;}
A:active {text-decoration: none;color: lime;}
A:visited {text-decoration: none;color: darkgreen;}
A:hover {text-decoration: underline;color: yellow;}
--> 
</style> 
</head> 
<body> 
<script language="JavaScript1.2"> 
/*********************************************** 
* Sliding Menu Bar Script 2- © Dynamic Drive ([url]www.dynamicdrive.com[/url]) 
* This notice must stay intact for use 
* Visit [url]http://www.dynamicdrive.com/for[/url] full source code 
***********************************************/ 

var slidemenu_width=160 //specify width of menu (in pixels) 
var slidemenu_reveal=12 //specify amount that menu should protrude initially 
var slidemenu_top=170 //specify vertical offset of menu on page 
var ns4=document.layers?1:0 
var ie4=document.all&&navigator.userAgent.indexOf("Opera")==-1 
var ns6=document.getElementById&&!document.all?1:0 

if (ie4||ns6) 
document.write('<div id="slidemenubar2" style="left:'+((slidemenu_width-slidemenu_reveal)*-1)+'; top:'+slidemenu_top+'; width:'+slidemenu_width+'" title="Press x to expand the menu, z to contract it">') 
else if (ns4){ 
document.write('<style>\n#slidemenubar{\nwidth:'+slidemenu_width+';}\n<\/style>\n') 
document.write('<layer id="slidemenubar" left=0 top='+slidemenu_top+' width='+slidemenu_width+' visibility=hide>') 
} 
var sitems=new Array() 

///////////Edit below///////////////////////////////// 
//siteitems[x]=["Item Text", "Optional URL associated with text"] 
sitems[0]=["<big><font face='Arial'>Site menu </font></big>", ""] 
sitems[1]=["Menus And Navigation", "http://www.dynamicdrive.com/dynamicindex1/] 
sitems[2]=["Document Effects", "http://www.dynamicdrive.com/dynamicindex3/] 
sitems[3]=["Scrollers", "http://www.dynamicdrive.com/dynamicindex2/] 
sitems[4]=["Image Effects", "http://www.dynamicdrive.com/dynamicindex4/] 
sitems[5]=["Links And Buttons", "http://www.dynamicdrive.com/dynamicindex5/] 
sitems[6]=["Dynamic Clocks & Dates", "http://www.dynamicdrive.com/dynamicindex6/] 
sitems[7]=["Text Animations", "http://www.dynamicdrive.com/dynamicindex10/] 
sitems[8]=["Browser Window", "http://www.dynamicdrive.com/dynamicindex8/] 
sitems[9]=["User System Information", "http://www.dynamicdrive.com/dynamicindex9/] 
sitems[10]=["Other", "http://www.dynamicdrive.com/dynamicindex11/] 

//If you want the links to load in another frame/window, specify name of target (ie: target="_new") 
var target="" 
/// 
if (ie4||ns4||ns6){ 
for (i=0;i<sitems.length;i++){ 
if (sitems[i][1]) 
document.write('<a href="'+sitems[i][1]+'" target="'+target+'">') 
document.write(sitems[i][0]) 
if (sitems[i][1]) 
document.write('</a>') 
document.write('<br>\n') 
} 
} 

function regenerate(){ 
window.location.reload() 
} 
function regenerate2(){ 
if (ns4){ 
document.slidemenubar.left=((slidemenu_width-slidemenu_reveal)*-1) 
document.slidemenubar.visibility="show" 
setTimeout("window.onresize=regenerate",400) 
} 
} 
window.onload=regenerate2 
rightboundary=0 
leftboundary=(slidemenu_width-slidemenu_reveal)*-1 
if (ie4||ns6){ 
document.write('</div>') 
themenu=(ns6)? document.getElementById("slidemenubar2").style : document.all.slidemenubar2.style 
} 
else if (ns4){ 
document.write('</layer>') 
themenu=document.layers.slidemenubar 
} 
function pull(){ 
if (window.drawit) 
clearInterval(drawit) 
pullit=setInterval("pullengine()",10) 
} 
function draw(){ 
clearInterval(pullit) 
drawit=setInterval("drawengine()",10) 
} 
function pullengine(){ 
if ((ie4||ns6)&&parseInt(themenu.left)<rightboundary) 
themenu.left=parseInt(themenu.left)+10 
else if(ns4&&themenu.left<rightboundary) 
themenu.left+=10 
else if (window.pullit){ 
themenu.left=0 
clearInterval(pullit) 
} 
} 
function drawengine(){ 
if ((ie4||ns6)&&parseInt(themenu.left)>leftboundary) 
themenu.left=parseInt(themenu.left)-10 
else if(ns4&&themenu.left>leftboundary) 
themenu.left-=10 
else if (window.drawit){ 
themenu.left=leftboundary 
clearInterval(drawit) 
} 
} 

if (ns4) 
document.captureEvents(Event.KEYPRESS) 
function menuengine(e){ 
if (ns4||ns6){ 
if (e.which==120) 
pull() 
if (e.which==122) 
draw() 
} 
else if (ie4){ 
if (event.keyCode==120) 
pull() 
if (event.keyCode==122) 
draw() 
} 
} 
document.onkeypress=menuengine 
</script>
<script language="JavaScript1.2">

/***********************************************
* Sliding Menu Bar Script- © Dynamic Drive ([url]www.dynamicdrive.com[/url])
* Visit [url]http://www.dynamicdrive.com/[/url] for full source code
* This notice must stay intact for use
***********************************************/

var slidemenu_width=160 //specify width of menu (in pixels)
var slidemenu_reveal=12 //specify amount that menu should protrude initially
var slidemenu_top=170   //specify vertical offset of menu on page

var ns4=document.layers?1:0
var ie4=document.all&&navigator.userAgent.indexOf("Opera")==-1
var ns6=document.getElementById&&!document.all?1:0

if (ie4||ns6)
document.write('<div id="slidemenubar2" style="left:'+((slidemenu_width-slidemenu_reveal)*-1)+'; top:'+slidemenu_top+'; width:'+slidemenu_width+'" onMouseover="pull()" onMouseout="draw()">')
else if (ns4){
document.write('<style>\n#slidemenubar{\nwidth:'+slidemenu_width+';}\n<\/style>\n')
document.write('<layer id="slidemenubar" left=0 top='+slidemenu_top+' width='+slidemenu_width+' onMouseover="pull()" onMouseout="draw()" visibility=hide>')
}

var sitems=new Array()

///////////Edit below/////////////

//siteitems[x]=["Item Text", "Optional URL associated with text"]

sitems[0]=["<big><font face='Arial'>Var det kanske detta du sökte?</font></big>", ""]
sitems[1]=["Menus And Navigation", "http://www.dynamicdrive.com/dynamicindex1/"]
sitems[2]=["Document Effects", "http://www.dynamicdrive.com/dynamicindex3/"]
sitems[3]=["Scrollers", "http://www.dynamicdrive.com/dynamicindex2/"]
sitems[4]=["Image Effects", "http://www.dynamicdrive.com/dynamicindex4/"]
sitems[5]=["Links And Buttons", "http://www.dynamicdrive.com/dynamicindex5/"]
sitems[6]=["Dynamic Clocks & Dates", "http://www.dynamicdrive.com/dynamicindex6/"]
sitems[7]=["Text Animations", "http://www.dynamicdrive.com/dynamicindex10/"]
sitems[8]=["Browser Window", "http://www.dynamicdrive.com/dynamicindex8/"]
sitems[9]=["User System Information", "http://www.dynamicdrive.com/dynamicindex9/"]
sitems[10]=["Other", "http://www.dynamicdrive.com/dynamicindex11/"]

//If you want the links to load in another frame/window, specify name of target (ie: target="_new")
var target=""
///

if (ie4||ns4||ns6){
for (i=0;i<sitems.length;i++){
if (sitems[i][1])
document.write('<a href="'+sitems[i][1]+'" target="'+target+'">')
document.write(sitems[i][0])
if (sitems[i][1])
document.write('</a>')
document.write('<br>\n')
}
}
function regenerate(){
window.location.reload()
}
function regenerate2(){
if (ns4){
document.slidemenubar.left=((slidemenu_width-slidemenu_reveal)*-1)
document.slidemenubar.visibility="show"
setTimeout("window.onresize=regenerate",400)
}
}
window.onload=regenerate2
rightboundary=0
leftboundary=(slidemenu_width-slidemenu_reveal)*-1
if (ie4||ns6){
document.write('</div>')
themenu=(ns6)? document.getElementById("slidemenubar2").style : document.all.slidemenubar2.style
}
else if (ns4){
document.write('</layer>')
themenu=document.layers.slidemenubar
}
function pull(){
if (window.drawit)
clearInterval(drawit)
pullit=setInterval("pullengine()",10)
}
function draw(){
clearInterval(pullit)
drawit=setInterval("drawengine()",10)
}
function pullengine(){
if ((ie4||ns6)&&parseInt(themenu.left)<rightboundary)
themenu.left=parseInt(themenu.left)+10
else if(ns4&&themenu.left<rightboundary)
themenu.left+=10
else if (window.pullit){
themenu.left=0
clearInterval(pullit)
}
}

function drawengine(){
if ((ie4||ns6)&&parseInt(themenu.left)>leftboundary)
themenu.left=parseInt(themenu.left)-10
else if(ns4&&themenu.left>leftboundary)
themenu.left-=10
else if (window.drawit){
themenu.left=leftboundary
clearInterval(drawit)
}
}
</script>
</body> 
</HTML>
```

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

## #5 — Qimen, 2003-10-05T09:30Z

> **Nexus86 skrev:**
>
> De hade gjort detta i Flash men hittar du ett javascript som fungerar så posta gärna en länk. :)

Jag har för mig det var dhtml/javascript, var det inte t.o.m ngn här på wf som undrade samma sak?
Tror t.o.m att vi länkade hit scriptfilerna ifrån telia men de blev redigerade pga regelbrott eller ngt i den stilen. :)

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

## #6 — Nexus86, 2003-10-05T16:10Z

Jaha. Där ser man. Hade för mig det var gjort i Flash. :)

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

## #7 — Jesper T, 2003-10-05T17:43Z

Nej, det var ett betydligt mer onödigt script.
En liten pil som flöt in ifrån sidan och hamnade bredvid länken som man hovrade över.
Tack ändå Bosse.

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

## #8 — dectgap, 2003-10-05T18:16Z

Varför göra det svårare än man behöver?

```
<img src="blank.gif" width="20" height="20" id="pil1" alt="" />
<a href="#" onmouseover="document.getElementById('pil1').src='pil.gif'" onmouseout="document.getElementById('pil1').src='blank.gif'">En länk</a>
<br />
<img src="blank.gif" width="20" height="20" id="pil2" alt="" />
<a href="#" onmouseover="document.getElementById('pil2').src='pil.gif'" onmouseout="document.getElementById('pil2').src='blank.gif'">En länk</a>
<br />
<img src="blank.gif" width="20" height="20" id="pil3" alt="" />
<a href="#" onmouseover="document.getElementById('pil3').src='pil.gif'" onmouseout="document.getElementById('pil3').src='blank.gif'">En länk</a>
<br />
<img src="blank.gif" width="20" height="20" id="pil4" alt="" />
<a href="#" onmouseover="document.getElementById('pil4').src='pil.gif'" onmouseout="document.getElementById('pil4').src='blank.gif'">En länk</a>
```

*blank.gif* är en blank bild och *pil.gif* är en animerad bild som visar en pil som kommer in ifrån vänster.

<http://roslund.homeip.net/mattias/inkommande_pil/>

Eller har jag missuppfattat hur du ville ha det?

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

## #9 — Qimen, 2003-10-05T18:21Z

dectgap: han vill ju få bilden att **glida** in ifrån vänster.

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

## #10 — dectgap, 2003-10-05T18:24Z

> **Qimen skrev:**
>
> dectgap: han vill ju få bilden att **glida** in ifrån vänster.

Ser det inte ut som att pilen glider in i mitt exempel?
Titta på sidan jag länkade till, där jag visar vad jag menar i praktiken.

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

## #11 — Nexus86, 2003-10-05T18:25Z

Meningen är att menyn ska vara horisontell. :)

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

## #12 — Qimen, 2003-10-05T18:27Z

> **dectgap skrev:**
>
> > **Qimen skrev:**
> >
> > dectgap: han vill ju få bilden att **glida** in ifrån vänster.
>
> 
> 
> Ser det inte ut som att pilen glider in i mitt exempel?
> Titta på sidan jag länkade till, där jag visar vad jag menar i praktiken.

Jag tycker bara dina punkter para dyker upp utan ngn specialeffekt alls. :l

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

## #13 — Web-Tor, 2003-10-05T18:27Z

> Eller har jag missuppfattat hur du ville ha det?

Det har du. ;)
Telias meny (som inte var flash ;)) var vågrät och pilen åkte hela vägen från skärmens västerkant till det menyalternativ som "markerades".

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

## #14 — dectgap, 2003-10-05T18:34Z

> **Web-Tor skrev:**
>
> > Eller har jag missuppfattat hur du ville ha det?
>
> 
> Det har du. ;)
> Telias meny (som inte var flash ;)) var vågrät och pilen åkte hela vägen från skärmens västerkant till det menyalternativ som "markerades".

Tack för förklaringen :)
Jag har inte sett hur Telias sida såg ut tidigare, så jag utgick bara ifrån den korta förklaringen i första inlägget.

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

## #15 — Nexus86, 2003-10-05T18:37Z

Och om man sedan drog undan pekaren från länken så åkte pilen tillbaka till kanten och om man sedan drog pilen över en ny länk innan den hunnit fram så avbröt den sin "resa" och åkte till den länken istället. :)

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

## #16 — DmS, 2003-10-06T11:20Z

Ta en titt här:
<http://www.dmsproject.com/newcv/>

Här har jag något liknande som jag gjorde 2001, men jag flyttar undermenyer istället för pilar. Inte helt buggfritt men det bör väl ge några ideer.

(obs att det är mouseover på indexsidan, onclick på de andra sidorna bara för att visa)
/Dan

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

---

Tråden på webben: https://www.webforum.nu/amne/javascript/87653-pilen-på-telia
