Avatar billede pelskee Nybegynder
21. maj 2004 - 12:59 Der er 12 kommentarer og
1 løsning

Preload af billeder

jeg har en menu hvor jeg gerne vil have en mere smooth overgang når man kører musen over, men mit preload af billeder virker ikke. hvordan får jeg en pæn overgang mellem onmouseover og onmouseout så det ikke som nu tager mere end 1 sekund før den skifter billedet. kan i hjælpe ?

eksempel på knap:
<td onClick="MM_goToURL('top','index.asp');return document.MM_returnValue" style="cursor:pointer" width="100" align="center" height="21" class="almWhiteBold" background="../images/frontend/menu_knap.jpg" onmouseover="this.style.backgroundImage='url(../images/frontend/menu_knap_over.gif)';" onmouseout="this.style.backgroundImage='url(../images/frontend/menu_knap.jpg)';">Forside</td>
Avatar billede powernodes Nybegynder
21. maj 2004 - 13:05 #1
hvordan ser dit preload script ud?
Du bruger Dreamweaver til dine links, DW har da også et preload script der fungerer fint.
Avatar billede pelskee Nybegynder
21. maj 2004 - 13:09 #2
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<script>
var myimages=new Array()
function preloadimages(){
for (i=0;i<preloadimages.arguments.length;i++){
myimages[i]=new Image()
myimages[i].src=preloadimages.arguments[i]
}
}
//Enter path of images to be preloaded inside parenthesis. Extend list as desired.
preloadimages("http://www.perchs.dk/images/frontend/menu_knap.jpg","http://www.perchs.dk/images/frontend/menu_knap_over.gif")
</script>
<html>
Avatar billede pelskee Nybegynder
21. maj 2004 - 13:13 #3
nu har jeg brugt dreamweaver og koden ser sådan ud, men jeg synes stadig det tager lang tid før den udskifter billederne:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
//-->
</script>
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_goToURL() { //v3.0
  var i, args=MM_goToURL.arguments; document.MM_returnValue = false;
  for (i=0; i<(args.length-1); i+=2) eval(args[i]+".location='"+args[i+1]+"'");
}
//-->
</script>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="MM_preloadImages('../../images/frontend/menu_knap_over.gif','../../images/frontend/menu_knap.jpg')">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
  <tr style="border:2px solid #333333">
<td onClick="MM_goToURL('top','index.asp');return document.MM_returnValue" style="cursor:pointer" width="100" align="center" height="21" class="almWhiteBold" background="../images/frontend/menu_knap.jpg" onmouseover="this.style.backgroundImage='url(../images/frontend/menu_knap_over.gif)';" onmouseout="this.style.backgroundImage='url(../images/frontend/menu_knap.jpg)';">
      Forside</td>
Avatar billede pelskee Nybegynder
21. maj 2004 - 13:13 #4
se evt dette link for eksempel - check den horisontale hovedmenu:
http://www.perchs.dk/dansk
Avatar billede powernodes Nybegynder
21. maj 2004 - 13:30 #5
Hvis du kigger på stien til dine billeder i DW preload scriptet, er den ikke den samme som på stien i billederne du skifter. Du går et niveau for langt tilbage.
Avatar billede pelskee Nybegynder
27. maj 2004 - 23:56 #6
http://www.perchs.dk/dansk/include/test_menu.asp
det ser da ikke rigtigt ud vel ? - jeg synes der går lang tid mellem den udskfiter billederne...

koden:
<%@LANGUAGE="VBSCRIPT" CODEPAGE="1252"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<link href="stylesheet.css" rel="stylesheet" type="text/css">
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
//-->
</script>
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_goToURL() { //v3.0
  var i, args=MM_goToURL.arguments; document.MM_returnValue = false;
  for (i=0; i<(args.length-1); i+=2) eval(args[i]+".location='"+args[i+1]+"'");
}
//-->
</script>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="MM_preloadImages('http://www.perchs.dk/images/frontend/menu_knap_over.gif','http://www.perchs.dk/images/frontend/menu_knap.jpg')">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
  <tr style="border:2px solid #333333">
<td onClick="MM_goToURL('top','index.asp');return document.MM_returnValue" style="cursor:pointer" width="100" align="center" height="21" class="almWhiteBold" background="http://www.perchs.dk/images/frontend/menu_knap.jpg" onmouseover="this.style.backgroundImage='url(http://www.perchs.dk/images/frontend/menu_knap_over.gif)';" onmouseout="this.style.backgroundImage='url(http://www.perchs.dk/images/frontend/menu_knap.jpg)';">
      Forside</td>
<td onClick="MM_goToURL('top','webshop.asp');return document.MM_returnValue" style="cursor:pointer" width="100" align="center" height="21" class="almWhiteBold" background="http://www.perchs.dk/images/frontend/menu_knap.jpg" onmouseover="this.style.backgroundImage='url(http://www.perchs.dk/images/frontend/menu_knap_over.gif)';" onmouseout="this.style.backgroundImage='url(http://www.perchs.dk/images/frontend/menu_knap.jpg)';">
      Webshop</td>
<td onClick="MM_goToURL('top','nyheder.asp');return document.MM_returnValue" style="cursor:pointer" width="100" align="center" height="21" class="almWhiteBold" background="http://www.perchs.dk/images/frontend/menu_knap.jpg" onmouseover="this.style.backgroundImage='url(http://www.perchs.dk/images/frontend/menu_knap_over.gif)';" onmouseout="this.style.backgroundImage='url(http://www.perchs.dk/images/frontend/menu_knap.jpg)';">
      Nyheder</td>
<td onClick="MM_goToURL('top','vardatvide.asp');return document.MM_returnValue" style="cursor:pointer" width="100" align="center" height="21" class="almWhiteBold" background="http://www.perchs.dk/images/frontend/menu_knap.jpg" onmouseover="this.style.backgroundImage='url(http://www.perchs.dk/images/frontend/menu_knap_over.gif)';" onmouseout="this.style.backgroundImage='url(http://www.perchs.dk/images/frontend/menu_knap.jpg)';">
      Værd at vide</td>
<td onClick="MM_goToURL('top','omos.asp');return document.MM_returnValue" style="cursor:pointer" width="100" align="center" height="21" class="almWhiteBold" background="http://www.perchs.dk/images/frontend/menu_knap.jpg" onmouseover="this.style.backgroundImage='url(http://www.perchs.dk/images/frontend/menu_knap_over.gif)';" onmouseout="this.style.backgroundImage='url(http://www.perchs.dk/images/frontend/menu_knap.jpg)';">
      Om os</td>
<td onClick="MM_goToURL('top','kontakt.asp');return document.MM_returnValue" style="cursor:pointer" width="100" align="center" height="21" class="almWhiteBold" background="http://www.perchs.dk/images/frontend/menu_knap.jpg" onmouseover="this.style.backgroundImage='url(http://www.perchs.dk/images/frontend/menu_knap_over.gif)';" onmouseout="this.style.backgroundImage='url(http://www.perchs.dk/images/frontend/menu_knap.jpg)';">
      Kontakt</td>
<td onClick="MM_goToURL('top','betingelser.asp');return document.MM_returnValue" style="cursor:pointer" width="100" align="center" height="21" class="almWhiteBold" background="http://www.perchs.dk/images/frontend/menu_knap.jpg" onmouseover="this.style.backgroundImage='url(http://www.perchs.dk/images/frontend/menu_knap_over.gif)';" onmouseout="this.style.backgroundImage='url(http://www.perchs.dk/images/frontend/menu_knap.jpg)';">
      Betingelser</td>
    <td align="right" bgcolor="#FFFFFF">
      <table border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td valign="bottom">&nbsp;&nbsp;<a href="#"><img src="http://www.perchs.dk/images/frontend/flag_dansk.gif" alt="Dansk" width="20" height="15" border="0"></a></td>
          <td valign="bottom">&nbsp;&nbsp;<a href="#"><img src="http://www.perchs.dk/images/frontend/flag_engelsk.gif" alt="English" width="20" height="15" border="0"></a></td>
          <td valign="bottom">&nbsp;&nbsp;<a href="#"><img src="http://www.perchs.dk/images/frontend/flag_tysk.gif" alt="Deutsch" width="20" height="15" border="0"></a></td>
        </tr>
    </table>
  </td>
  </tr>
</table>
</body>
</html>
Avatar billede pelskee Nybegynder
27. maj 2004 - 23:58 #7
btw - undskyld mit sene svar
Avatar billede pelskee Nybegynder
28. maj 2004 - 00:00 #8
billederne fylder henholdsvis 930 og 444 kb - så jeg tror ikke det er størrelserne
Avatar billede pelskee Nybegynder
28. maj 2004 - 00:03 #9
altså bytes :)
Avatar billede pelskee Nybegynder
02. juli 2004 - 11:43 #10
tak for hjælpen
skylder dig point
Avatar billede pelskee Nybegynder
09. august 2004 - 10:30 #11
powernodes - skylder dig point.
Avatar billede powernodes Nybegynder
09. august 2004 - 10:32 #12
ahh sorry :)
Avatar billede pelskee Nybegynder
09. august 2004 - 15:14 #13
:)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester