webForumDet fria alternativet

Lager som "flyter" in vid onload?

8 svar · 293 visningar · startad av Jesper T

Jesper TMedlem sedan nov. 20017 144 inlägg
#1

Hur skapar man lämpigast ett lager som "flyter" in ifrån högra sidan på webbläsaren och lägger sig på bestämd plats?
Det skadar inte heller att det är crossbrowser. :)

cyprysMedlem sedan dec. 20003 563 inlägg
#2

Det borde nästan finnas något sådant på http://www.dhtmlcentral.com/ ;)

dectgapMedlem sedan sep. 20021 655 inlägg
#3

Så här kanske?

<script type="text/javascript">
window.onload=function(){
  document.getElementById('flyttkarl').style.left=screen.availWidth+'px';
  flytta('flyttkarl', 200)
}

function flytta(objId, min){
  if(parseInt(document.getElementById(objId).style.left)>min){
    document.getElementById(objId).style.left=parseInt(document.getElementById(objId).style.left)-5+'px';
    setTimeout('flytta(\''+objId+'\','+min+')', 20);
  }
}
</script>

<style type="text/css">
html, body {
  margin: 0;
  overflow: hidden;
}

#flyttkarl {
  position: absolute;
  height: 130px;
  width: 130px;
  padding: 20px;
  border: 1px solid #000;
  font: bold 10px Verdana;
}
</style>

...

<div id="flyttkarl">Jag flyger in från höger, och stannar 200px från vänsterkanten</div>
Jesper TMedlem sedan nov. 20017 144 inlägg
#4

Tack, men...
fel: ")" förväntas
rad: 19

rad19 --> setTimeout('flytta(''+objId+'','+min+')', 20);

dectgapMedlem sedan sep. 20021 655 inlägg
#5

Det blev visst galet när jag lade in koden här.

Så här ska det skrivas:

setTimeout('flytta(x''+objId+'x','+min+')', 20);

Ersätt x med ett \, så det blir så här, utan mellanslag:

\ ' '+objId+' \ '
Jesper TMedlem sedan nov. 20017 144 inlägg
#6

Tack, funkar bra i I.E. 6.0
Vet du hur det är med andra browsers?

Jesper TMedlem sedan nov. 20017 144 inlägg
#7

Jag märkte att man kan få den att gå fortare genom att ändra siffran. Men hur får man det hela att gå ännu fortare?

dectgapMedlem sedan sep. 20021 655 inlägg
#8

Jag har testat i Mozilla och Opera, och det fungerade hur bra som helst.

På denna raden kan du ändra femman till ett större tal, för att rutan ska flyttas ett större steg varje gång:

document.getElementById(objId).style.left=parseInt(document.getElementById(objId).style.left)-5+'px'
bossseMedlem sedan juni 2003772 inlägg
#9

För att få en mjuk flyttning så ange stegen till -15, och tiden mellan varje steg till 40, eller nåt i närheten av det.

document.getElementById(objId).style.left=parseInt(document.getElementById(objId).style.left)-15+'px';
setTimeout('flytta(\''+objId+'\','+min+')', 40);
130 ms totalt · 3 externa anrop · v20260731065814-full.30151723
0 ms — hämta forumlista (cache)
0 ms — hämta statistik (cache)
128 ms — hämta tråd, inlägg och bilagor (db)