CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg
Cookie ikon
Avatar billede prodoc Nybegynder
25. september 2007 - 21:30 Der er 25 kommentarer og
1 løsning

Scrolle en div med et billede

Hej allesammen, jeg har en hjemmeside som jeg netop er ved at arbejde sammen med Joomla, derfor har jeg ændret min hjemmesidekode til Divs (i stedet for Iframes) men jeg kan simplethen ikke få det til at virke... altså scrolleren, der findes vel ikke en som kan fortælle mig hvad forskellen er mellem iframe og div... altså hvad fejlen er herunder??

<script type="text/javascript">
<!--

refreshspeed=10;
refreshspeed2=1000;

curpage="";
scrollvalue=0;
scrollheight=new Array();
scrollpages=new Array("MainID","SubmenuID");
chkvar=true;

window.onload=function(){

setInterval("scrollme();",refreshspeed);

for(ri=0;ri<scrollpages.length;ri++)scrollheight[ri]=document.getElementById(scrollpages[ri]).scrollHeight;

setInterval("scrollhigh();",refreshspeed2);

}

function scrollme(){
if(curpage!="")window.frames[curpage].scrollBy(0,scrollvalue);
}

function scrollhigh(){
for(ri=0;ri<scrollpages.length;ri++){
  cntmpt=document.getElementById(scrollpages[ri].replace("ID","st"));
  cntmpb=document.getElementById(scrollpages[ri].replace("ID","sb"));
    if(+window.frames[scrollpages[ri].replace("ID",""))].document.body.scrollHeight>+scrollheight[ri])chkvar=true;else chkvar=false;
  cntmpt.src=(chkvar)?cntmpt.src.replace(scrollpages[ri]+"notopscroll.jpg",scrollpages[ri]+"topscroll.jpg"):cntmpt.src.replace(scrollpages[ri]+"topscroll.jpg",scrollpages[ri]+"notopscroll.jpg");
  cntmpb.src=(chkvar)?cntmpb.src.replace(scrollpages[ri]+"nobottomscroll.jpg",scrollpages[ri]+"bottomscroll.jpg"):cntmpb.src.replace(scrollpages[ri]+"bottomscroll.jpg",scrollpages[ri]+"nobottomscroll.jpg");

}
}

//-->
</script>

<a href="#null" onmouseover="curpage='Submenu';scrollvalue=-1;" onmousedown="scrollvalue=-10;" onmouseup="scrollvalue=-2;" onmouseout="scrollvalue=0;"><img id="Submenust" src="Grafik/SubmenuIDtopscroll.jpg" border="0" height="15" width="59" /></a>


Jeg forstår simpelthen ikke hvorfor det ikke virker?
Avatar billede jhe-ting Nybegynder
26. september 2007 - 00:38 #1
den største forskel er nok: Du finder ingen DIV's i samlingen 'frames'.
For at finde din div skal du bruge noget i stil med:

  var elm = document.getElementById(strID);
Avatar billede jhe-ting Nybegynder
26. september 2007 - 00:39 #2
- og så skal du nok også se på 'style.overflow' på dine div's
Avatar billede jhe-ting Nybegynder
26. september 2007 - 00:41 #3
- øh - hvor ER egentlig dine div's ???
Avatar billede prodoc Nybegynder
26. september 2007 - 07:09 #4
Hov undskyld, dem glemte jeg lige at sætte ind :)

Her er SubmenuID:
<div id="SubmenuID" class="Undermenu" style="background-image:url('templates/isstemplate/images/SubMenu_Background.jpg'); color: White; position:absolute; overflow: auto; left: 89px; top: 226px; width: 165px; height: 232px; padding: 0px; padding-right: 0px;">
<?php if($this->countModules('left')) : ?>
<jdoc:include type="modules" name="left" style="" />
<?php endif; ?>
</div>

Og her er MainID Div'en:
<div id="MainID" class="Main" style="background-image:url('templates/isstemplate/images/Main_Background.jpg'); color: White; position: absolute; overflow: auto; left: 281px; top: 123px; width: 478px; height: 464px; padding: 0px; padding-right: 0px;">
<a name="content"></a>
<?php if ($this->countModules('user1 + user2 + right + top')) : ?>
    <div id="main2">
<?php else : ?>
    <div id="main">
<?php endif; ?>

<?php if ($this->getBuffer('message')) : ?>
    <div class="error">
        <h2> Message </h2>
        <jdoc:include type="message" />
    </div>
<?php endif; ?>

    <jdoc:include type="component" />

        </div>
</div>

Det hele ligger på http://www.isyvsind.dk :)
(Har sat overflow til auto, fordi jeg var lidt træt af ikke at kunne scrolle, men ville helst at den stod på hidden:)
Avatar billede jhe-ting Nybegynder
26. september 2007 - 13:55 #5
Har du prøvet at rette 'scrollme'-funktionen så den bruger 'getElementById'?

function scrollme(){
if(curpage!="")document.getElementById(curpage).scrollBy(0,scrollvalue);
}

Hvad er det med ....replace("ID","st") ???

'curpage' _skal_ indeholde en gyldig ID-streng for at det virker.
Avatar billede jhe-ting Nybegynder
26. september 2007 - 13:58 #6
Det er links som denne:

<a href="#null" onmouseover="curpage='Submenu';scrollvalue=-1;" onmousedown="scrollvalue=-10;" onmouseup="scrollvalue=-2;" onmouseout="scrollvalue=0;"><img id="Submenust" src="Grafik/SubmenuIDtopscroll.jpg" border="0" height="15" width="59" /></a>

Der er vist ingen elementer der har 'Submenu' som ID, hedder den ikke 'SubmenuID'?

Er det ikke det samme problem med 'MainID' ???

Du må have ordentligt styr på navnene. ;-)
Avatar billede prodoc Nybegynder
26. september 2007 - 17:39 #7
Det andet sted hvor jeg havde Iframes hed de MainId og SubmenuID, men ja dengang gik den bestemt heller ikke igennem W3C kontrollen :)
Jeg kunne vel ikke få dig til at indføre de ændringer du nævner, for er ikke så skarp i Java programmeringen... :)
Avatar billede jhe-ting Nybegynder
26. september 2007 - 20:45 #8
Når du bruger PHP til at danne din HTML, hjælper det jo ikke så meget, hvis jeg bare viser dig, hvordan den rigtige HTML skal se ud.
Så må du fremvise den komplette kode, hvoraf det fremgår hvad alting hedder og hvordan det hænger sammen.
Avatar billede prodoc Nybegynder
26. september 2007 - 20:58 #9
Det må du undskylde, her er den komplette kode med forklaringer:
dette ligger på www.isyvsind.dk



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Thomas &Oslash;sterlund Mortensens hjemmeside</title>
<jdoc:include type="head" />
<link rel="stylesheet" href="templates/_system/css/general.css" type="text/css" />
<link rel="stylesheet" href="templates/<?php echo $this->template ?>/css/template_css.css" type="text/css" />
<!--Herunder starter et af mine scripts som åbner to links med et tryk-->
<script type="text/javascript">
function twoLinks(link1,link2){
parent.Submenu.location.href = link1;
parent.Main.location.href = link2;
}

</script>
<!--Herunder starter det javascript som får sub og main menuen til at scrolle samt, at tjekke der overhovedet er brug for at scrolle, er dette ikke tilfældet kommer der et andet billede frem (i dette tilfælde ingenting, altså pilen fjernes)-->
<script type="text/javascript">
<!--

refreshspeed=10;
refreshspeed2=1000;

curpage="";
scrollvalue=0;
scrollheight=new Array();
scrollpages=new Array("MainID","SubmenuID");
chkvar=true;

window.onload=function(){

setInterval("scrollme();",refreshspeed);

for(ri=0;ri<scrollpages.length;ri++)scrollheight[ri]=document.getElementById(scrollpages[ri]).scrollHeight;

setInterval("scrollhigh();",refreshspeed2);

}

function scrollme(){
if(curpage!="")window.frames[curpage].scrollBy(0,scrollvalue);
}

function scrollhigh(){
for(ri=0;ri<scrollpages.length;ri++){
cntmpt=document.getElementById(scrollpages[ri].replace("ID","st"));
cntmpb=document.getElementById(scrollpages[ri].replace("ID","sb"));
if(+window.frames[(scrollpages[ri].replace("ID",""))].document.body.scrollHeight>+scrollheight[ri])chkvar=true;else chkvar=false;
cntmpt.src=(chkvar)?cntmpt.src.replace(scrollpages[ri]+"notopscroll.jpg",scrollpages[ri]+"topscroll.jpg"):cntmpt.src.replace(scrollpages[ri]+"topscroll.jpg",scrollpages[ri]+"notopscroll.jpg");
cntmpb.src=(chkvar)?cntmpb.src.replace(scrollpages[ri]+"nobottomscroll.jpg",scrollpages[ri]+"bottomscroll.jpg"):cntmpb.src.replace(scrollpages[ri]+"bottomscroll.jpg",scrollpages[ri]+"nobottomscroll.jpg");

}
}

//-->
</script>
<style type="text/css">
body    {
background-color:Black;
background-image:url(templates/isstemplate/images/Background_Overall.gif);
color: White;
font-family: Arial;
font-size: 11px;
margin-left: 0px;
margin-right: 0px;
}
</style>
</head>
<body>

<div class="container" style="postion: absolute; width: 880px; height: 697px;">

<div class="Perefi_Top" style="position: absolute; left: 0px; top: 0px; width: 860px; height: 15px; padding: 0px; padding-right: 0px;">
<img src="templates/isstemplate/images/Frame_Top_Transparent.gif" alt="" style="width: 860px; height: 15px; border: none;" />
</div>

<div class="Ramme_Top" style="background-color: Black; color: black; position: absolute; left: 0px; top: 15px; width: 860px; height: 93px; padding: 0px; padding-right: 0px;">
<img src="templates/isstemplate/images/Frame_TopBar_1.jpg" alt="" style="width:860px; height:18px; border:none;" /><br />
<img src="templates/isstemplate/images/Frame_TopBar_2_Left.jpg" alt="" style="width:141px; height:29px; border:none;" /><img src="templates/isstemplate/images/Frame_TopBar_2_Button.jpg" alt="" style="width:25px; height:29px; border:none;" /><img src="templates/isstemplate/images/Frame_TopBar_2_Right.jpg" alt="" style="width:694px; height:29px; border:none;" /><br />
<img src="templates/isstemplate/images/Frame_TopBar_3.jpg" alt="" style="width:860px; height:46px; border:none;" />
</div>

<div class="Ramme_Hojre" style="background-color: Black; color: black; position: absolute; left: 0px; top: 108px; width: 89px; height: 494px; padding: 0px; padding-right: 0px;">
<img src="templates/isstemplate/images/Frame_LeftBar.jpg" alt="" style="width:89px; height:494px; border:none;" />

</div>

<div class="Ramme_Bund" style="background-color: Black; color: black; position: absolute; left: 0px; top: 602px; width: 860px; height: 95px; padding: 0px; padding-right: 0px;">
<img src="templates/isstemplate/images/Frame_Bottombar.jpg" alt="" style="width:860px; height:95px; border:none;" />
</div>


<div class="Menu" style="background-color: Black; color: black; position: absolute; left: 89px; top: 108px; width: 165px; height: 103px; padding: 0px; padding-right: 0px;">
<img src="templates/isstemplate/images/Menu_Top.jpg" alt="" style="width:165px; height:26px; border:none;" /><br />
<img src="templates/isstemplate/images/Menu_Media_Left.jpg" alt="" style="width:49px; height:17px; border:none;" /><img src="templates/isstemplate/images/Menu_Media_Button.jpg" alt="" style="width:37px; height:17px; border:none" /><img src="templates/isstemplate/images/Menu_Media_Right.jpg" alt="" style="width:79px; height:17px; border:none;" /><br />
<img src="templates/isstemplate/images/Menu_Projekter_Left.jpg" alt="" style="width:47px; height:18px; border:none;" /><img src="templates/isstemplate/images/Menu_Projekter_Button.jpg" alt="" style="width:72px; height:18px; border:none;" /><img src="templates/isstemplate/images/Menu_Projekter_Right.jpg" alt="" style="width:46px; height:18px; border:none;" /><br />
<img src="templates/isstemplate/images/Menu_Tanker_Left.jpg" alt="" style="width:45px; height:14px; border:none;" /><img src="templates/isstemplate/images/Menu_Tanker_Button.jpg" alt="" style="width:42px; height:14px; border:none;" /><img src="templates/isstemplate/images/Menu_Tanker_Right.jpg" alt="" style="width:78px; height:14px; border:none;" /><br />
<img src="templates/isstemplate/images/Menu_Mig_Left.jpg" alt="" style="width:44px; height:11px; border:none;" /><img src="templates/isstemplate/images/Menu_Mig_Button.jpg" alt="" style="width:21px; height:11px; border:none;" /><img src="templates/isstemplate/images/Menu_Mig_Right.jpg" alt="" style="width:100px; height:11px; border:none;" /><br />
<img src="templates/isstemplate/images/Menu_Andet_Left.jpg" alt="" style="width:45px; height:17px; border:none;" /><img src="templates/isstemplate/images/Menu_Andet_Button.jpg" alt="" style="width:46px; height:17px; border:none;" /><img src="templates/isstemplate/images/Menu_Andet_Right.jpg" alt="" style="width:74px; height:17px; border:none;" />
</div>

<div class="Undermenu_Scroller_Top" style="background-color: Black; color: black; position: absolute; left: 89px; top: 211px; width: 165px; height: 15px; padding: 0px; padding-right: 0px;">
<img src="templates/isstemplate/images/SubMenu_TopScroll_Left.jpg" alt="" style="width:53px; height:15px; border:none;" /><a href="#null" onmouseover="curpage='Submenu';scrollvalue=-1;" onmousedown="scrollvalue=-10;" onmouseup="scrollvalue=-2;" onmouseout="scrollvalue=0;"><img id="Submenust" src="templates/isstemplate/images/SubmenuIDtopscroll.jpg" alt="" style="width:59px; height:15px; border:none;"/></a><img src="templates/isstemplate/images/SubMenu_TopScroll_Right.jpg" alt="" style="width:53px; height:15px; border:none;" />

</div>
<!--Herunder starter den div så hvori Submenuen er, koden er til Joomla-->
<div id="Submenu" class="Undermenu" style="background-image:url('templates/isstemplate/images/SubMenu_Background.jpg'); color: White; position:absolute; overflow: auto; left: 89px; top: 226px; width: 165px; height: 232px; padding: 0px; padding-right: 0px;">
<?php if($this->countModules('left')) : ?>
<jdoc:include type="modules" name="left" style="" />
<?php endif; ?>
</div>

<div class="Undermenu_Scroller_Bund" style="background-color: Black; color: black; position: absolute; left: 89px; top: 458px; width: 165px; height: 15px; padding: 0px; padding-right: 0px;">
<img src="templates/isstemplate/images/SubMenu_BottomScroll_Left.jpg" alt="" style="width:54px; height:15px; border:none;" /><a href="#null" onmouseover="curpage='Submenu';scrollvalue=1;" onmousedown="scrollvalue=10;" onmouseup="scrollvalue=2;" onmouseout="scrollvalue=0;"><img id="Submenusb" src="templates/isstemplate/images/SubmenuIDbottomscroll.jpg" alt="" style="width:59px; height:15px; border:none;" /></a><img src="templates/isstemplate/images/SubMenu_BottomScroll_Right.jpg" alt="" style="width:52px; height:15px; border:none;" />
</div>

<div class="Bamsediv" style="background-color: Black; color: black; position: absolute; left: 89px; top: 473px; width: 165px; height: 129px; padding: 0px; padding-right: 0px;">
<img src="templates/isstemplate/images/BoksebamseTop.jpg" alt="" style="width:165px; height:44px; border:none;" /><br />
<img src="templates/isstemplate/images/BoksebamseMiddleLeft.jpg" alt="" style="width:13px; height:19px; border:none;" /><a href="index.php?option=com_user&view=login"><img src="templates/isstemplate/images/BoksebamseMiddleButton.jpg" alt="" style="width:19px; height:19px; border:none; cursor:default;" /></a><img src="templates/isstemplate/images/BoksebamseMiddleRight.jpg" alt="" style="width:133px; height:19px; border:none;" /><br />
<img src="templates/isstemplate/images/BoksebamseBottom.jpg" alt="" style="width:165px; height:66px; border:none;" />
</div>

<div class="Ramme_Midt" style="background-color: Black; color: black; position: absolute; left: 254px; top: 108px; width: 27px; height: 494px; padding: 0px; padding-right: 0px;">
<img src="templates/isstemplate/images/Frame_MiddleBar.jpg" alt="" style="width:27px; height:494px; border:none;" />
</div>

<div class="Main_Scroller_Top" style="background-color: Black; color: black; position: absolute; left: 281px; top: 108px; width: 478px; height: 15px; padding: 0px; padding-right: 0px;">
<img src="templates/isstemplate/images/Main_TopScroll_Left.jpg" alt="" style="width:209px; height:15px; border:none;" /><a href="#null" onmouseover="curpage='Main';scrollvalue=-5;" onmousedown="scrollvalue=-10;" onmouseup="scrollvalue=-5;" onmouseout="scrollvalue=0;"><img id="Mainst" src="templates/isstemplate/images/MainIDtopscroll.jpg" alt="" style="width:59px; height:15px; border:none;" /></a><img src="templates/isstemplate/images/Main_TopScroll_Right.jpg" alt="" style="width:210px; height:15px; border:none;" />
</div>
<!--Herunder starter den div så hvori MainMenuen er, koden er til Joomla-->
<div id="Main" class="Main" style="background-image:url('templates/isstemplate/images/Main_Background.jpg'); color: White; position: absolute; overflow: auto; left: 281px; top: 123px; width: 478px; height: 464px; padding: 0px; padding-right: 0px;">
<a name="content"></a>
<?php if ($this->countModules('user1 + user2 + right + top')) : ?>
<div id="main2">
<?php else : ?>
<div id="main">
<?php endif; ?>

<?php if ($this->getBuffer('message')) : ?>
<div class="error">
<h2> Message </h2>
<jdoc:include type="message" />
</div>
<?php endif; ?>

<jdoc:include type="component" />

</div>
</div>

<div class="Main_Scroller_Bund" style="background-color: Black; color: black; position: absolute; left: 281px; top: 587px; width: 478px; height: 15px; padding: 0px; padding-right: 0px;">
<img src="templates/isstemplate/images/Main_BottomScroll_Left.jpg" alt="" style="width:209px; height:15px; border:none;" /><a href="#null" onmouseover="curpage='Main';scrollvalue=5;" onmousedown="scrollvalue=10;" onmouseup="scrollvalue=5;" onmouseout="scrollvalue=0;"><img id="Mainsb" src="templates/isstemplate/images/MainIDbottomscroll.jpg" alt="" style="width:59px; height:15px; border:none;" /></a><img src="templates/isstemplate/images/Main_BottomScroll_Right.jpg" alt="" style="width:210px; height:15px; border:none;" />
</div>

<div class="Ramme_Venstre" style="background-color: Black; color: black; position: absolute; left: 759px; top: 108px; width: 101px; height: 494px; padding: 0px; padding-right: 0px;">
<img src="templates/isstemplate/images/Frame_RightBar.jpg" alt="" style="width:101px; height:494px; border:none;" />
</div>

<div class="Pereferi_Venstre" style="position:absolute; left:860px; top:0px; width:20px; height:697px; padding:0px; padding-right:0px;">
<img src="templates/isstemplate/images/Frame_Right_Transparent.gif" alt="" style="width:20px; height:697px; border:none;" />
</div>

</div>
</body>
</html>

Håber mine kommentarer i koden er tilstrækkelig?
Avatar billede jhe-ting Nybegynder
26. september 2007 - 21:02 #10
Ingen grund til at undskylde, som sådan, jeg ser lige på det ...
Avatar billede jhe-ting Nybegynder
26. september 2007 - 21:39 #11
Alle steder hvor der står <?php  ...    $this->  ...  ?> giver PHP fejl.


Hvor kommer f.eks.
  $this->language
  $this->template
  $this->countModules()
og
  $this->getMessage()
fra?

Er det jomla?

Den kode du viser er desværre ikke 'stand-alone', derimod afhænger den af 'noget udenom', så jeg kan ikke teste den som den er.
Jeg kan selvfølgelig prøve at gætte, men det vil være lidt omstændeligt at sende så megen kode frem og tilbage her på siden. Kan du 'skrælle' det overflødige fra så jeg kan arbejde på en stand-alone udgave?
Avatar billede prodoc Nybegynder
27. september 2007 - 00:34 #12
Hej jhe-ting så har jeg beskrevet og forkortet koden så det er mere ind til benet... :) Måske skulle jeg lige nævne at da jeg første gang fik hjælp til at lave denne funktion var det her: http://www.eksperten.dk/spm/701619 det skete. Håber det er bedre nu:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Thomas &Oslash;sterlund Mortensens hjemmeside</title>
<!--Joomlakode start, har ingen betydning for noget andet end Joomla koden-->
<jdoc:include type="head" />
<!--Joomlakode slut-->
<!--Herunder starter det javascript som får sub og main menuen til at scrolle samt, at tjekke der overhovedet er brug for at scrolle, er dette ikke tilfældet kommer der et andet billede frem (i dette tilfælde ingenting, altså pilen fjernes)-->
<script type="text/javascript">
<!--

refreshspeed=10; <!--Refreshspeed ved mouseover-->
refreshspeed2=1000;<!--Refreshspeed ved tryk på scroll billedet-->

curpage="";
scrollvalue=0;
scrollheight=new Array();
scrollpages=new Array("MainID","SubmenuID"); <!--Hvad hedder de Iframes som scrolleren skal påvirkes af-->
chkvar=true;

window.onload=function(){

setInterval("scrollme();",refreshspeed);

for(ri=0;ri<scrollpages.length;ri++)scrollheight[ri]=document.getElementById(scrollpages[ri]).scrollHeight;

setInterval("scrollhigh();",refreshspeed2);

}

function scrollme(){
if(curpage!="")window.frames[curpage].scrollBy(0,scrollvalue);
}
<!--Herunder er den funktion hvor den finder ud af om der er brug for en scroller hvis ikke så viser den billederne noxxxscroll.jpg-->
function scrollhigh(){
for(ri=0;ri<scrollpages.length;ri++){
cntmpt=document.getElementById(scrollpages[ri].replace("ID","st"));
cntmpb=document.getElementById(scrollpages[ri].replace("ID","sb"));
if(+window.frames[(scrollpages[ri].replace("ID",""))].document.body.scrollHeight>+scrollheight[ri])chkvar=true;else chkvar=false;
cntmpt.src=(chkvar)?cntmpt.src.replace(scrollpages[ri]+"notopscroll.jpg",scrollpages[ri]+"topscroll.jpg"):cntmpt.src.replace(scrollpages[ri]+"topscroll.jpg",scrollpages[ri]+"notopscroll.jpg");
cntmpb.src=(chkvar)?cntmpb.src.replace(scrollpages[ri]+"nobottomscroll.jpg",scrollpages[ri]+"bottomscroll.jpg"):cntmpb.src.replace(scrollpages[ri]+"bottomscroll.jpg",scrollpages[ri]+"nobottomscroll.jpg");

}
}

//-->
</script>

</head>
<body>

<!--Herunder er top scroller billedet til Submenuen-->
<div class="Undermenu_Scroller_Top" style="background-color: Black; color: black; position: absolute; left: 89px; top: 211px; width: 165px; height: 15px; padding: 0px; padding-right: 0px;">
<img src="templates/isstemplate/images/SubMenu_TopScroll_Left.jpg" alt="" style="width:53px; height:15px; border:none;" /><a href="#null" onmouseover="curpage='Submenu';scrollvalue=-1;" onmousedown="scrollvalue=-10;" onmouseup="scrollvalue=-2;" onmouseout="scrollvalue=0;"><img id="Submenust" src="templates/isstemplate/images/SubmenuIDtopscroll.jpg" alt="" style="width:59px; height:15px; border:none;"/></a><img src="templates/isstemplate/images/SubMenu_TopScroll_Right.jpg" alt="" style="width:53px; height:15px; border:none;" />

</div>
<!--Herunder starter den div så hvori Submenuen er-->
<div id="Submenu" class="Undermenu" style="background-image:url('templates/isstemplate/images/SubMenu_Background.jpg'); color: White; position:absolute; overflow: auto; left: 89px; top: 226px; width: 165px; height: 232px; padding: 0px; padding-right: 0px;">
<!--Joomlakode start-->
<?php if($this->countModules('left')) : ?>
<jdoc:include type="modules" name="left" style="" />
<?php endif; ?>
<!--Joomlakode slut-->
</div>
<!--I denne div herunder er den kode hvor scrollbilledet til Submenuen er i-->
<div class="Undermenu_Scroller_Bund" style="background-color: Black; color: black; position: absolute; left: 89px; top: 458px; width: 165px; height: 15px; padding: 0px; padding-right: 0px;">
<img src="templates/isstemplate/images/SubMenu_BottomScroll_Left.jpg" alt="" style="width:54px; height:15px; border:none;" /><a href="#null" onmouseover="curpage='Submenu';scrollvalue=1;" onmousedown="scrollvalue=10;" onmouseup="scrollvalue=2;" onmouseout="scrollvalue=0;"><img id="Submenusb" src="templates/isstemplate/images/SubmenuIDbottomscroll.jpg" alt="" style="width:59px; height:15px; border:none;" /></a><img src="templates/isstemplate/images/SubMenu_BottomScroll_Right.jpg" alt="" style="width:52px; height:15px; border:none;" />
</div>

<!--Main top scroller billedet er herunder-->
<div class="Main_Scroller_Top" style="background-color: Black; color: black; position: absolute; left: 281px; top: 108px; width: 478px; height: 15px; padding: 0px; padding-right: 0px;">
<img src="templates/isstemplate/images/Main_TopScroll_Left.jpg" alt="" style="width:209px; height:15px; border:none;" /><a href="#null" onmouseover="curpage='Main';scrollvalue=-5;" onmousedown="scrollvalue=-10;" onmouseup="scrollvalue=-5;" onmouseout="scrollvalue=0;"><img id="Mainst" src="templates/isstemplate/images/MainIDtopscroll.jpg" alt="" style="width:59px; height:15px; border:none;" /></a><img src="templates/isstemplate/images/Main_TopScroll_Right.jpg" alt="" style="width:210px; height:15px; border:none;" />
</div>
<!--Herunder starter den div så hvori MainMenuen er-->
<div id="Main" class="Main" style="background-image:url('templates/isstemplate/images/Main_Background.jpg'); color: White; position: absolute; overflow: auto; left: 281px; top: 123px; width: 478px; height: 464px; padding: 0px; padding-right: 0px;">
<!--Joomlacontent start-->
<a name="content"></a>
<?php if ($this->countModules('user1 + user2 + right + top')) : ?>
<div id="main2">
<?php else : ?>
<div id="main">
<?php endif; ?>

<?php if ($this->getBuffer('message')) : ?>
<div class="error">
<h2> Message </h2>
<jdoc:include type="message" />
</div>
<?php endif; ?>

<jdoc:include type="component" />
<!--Joomlacontent slut-->
</div>
</div>
<!--Main bund scroller billedet er herunder-->
<div class="Main_Scroller_Bund" style="background-color: Black; color: black; position: absolute; left: 281px; top: 587px; width: 478px; height: 15px; padding: 0px; padding-right: 0px;">
<img src="templates/isstemplate/images/Main_BottomScroll_Left.jpg" alt="" style="width:209px; height:15px; border:none;" /><a href="#null" onmouseover="curpage='Main';scrollvalue=5;" onmousedown="scrollvalue=10;" onmouseup="scrollvalue=5;" onmouseout="scrollvalue=0;"><img id="Mainsb" src="templates/isstemplate/images/MainIDbottomscroll.jpg" alt="" style="width:59px; height:15px; border:none;" /></a><img src="templates/isstemplate/images/Main_BottomScroll_Right.jpg" alt="" style="width:210px; height:15px; border:none;" />
</div>

</body>
</html>
Avatar billede jhe-ting Nybegynder
27. september 2007 - 04:19 #13
OK - Nu er jeg tættere på en løsning.

Der er flere forskelle mellem div's og iframes, end bare det at finde dem.
Der er intet document inden i en div, så der er ikke support fro scrollBy(...), man må bruge sctollTop og scrollLeft for at rulle.
Derfor omskriver jeg nu det oprindelige script så det husker positionen og ruller op/ned på de to div's "Main" og "Submenu".
Det betyder at de fire "a" tag's der aktiverer rulningen nok også kommer til at blive rettet.
Der går nok lidt tid med det ... :-P
Vender snart tilbage...
Avatar billede jhe-ting Nybegynder
27. september 2007 - 05:49 #14
Det er måske ikke den mest elegante løsning, men på denne måde er det 'nok' at rette script'et til dette:


<script type="text/javascript">
<!--

refreshspeed=10;
refreshspeed2=1000;

curpage="";
scrollvalue=0;
scrollheight=new Array();
scrollpages=new Array("MainID","SubmenuID");
chkvar=true;

function gEl(idStr){
    return document.getElementById(idStr);
}
window.onload=function(){

setInterval("scrollme();",refreshspeed);

for(ri=0;ri<scrollpages.length;ri++)scrollheight[ri]=document.getElementById(scrollpages[ri].replace("ID","")).scrollHeight;

setInterval("scrollhigh();",refreshspeed2);

}

function scrollme(){
  if(curpage!=""){
    var el = gEl(curpage);
    var top = el.scrollTop;
    //if (el.scrollTop < el.scrollHeight - parseInt(el.style.height)){
      el.scrollTop=top+scrollvalue;
    //}
  }
}

function scrollhigh(){
for(ri=0;ri<scrollpages.length;ri++){
  cntmpt=document.getElementById(scrollpages[ri].replace("ID","st"));
  cntmpb=document.getElementById(scrollpages[ri].replace("ID","sb"));
    if(+gEl((scrollpages[ri].replace("ID",""))).scrollHeight>+scrollheight[ri])chkvar=true;else chkvar=false;
  cntmpt.src=(chkvar)?cntmpt.src.replace(scrollpages[ri]+"notopscroll.jpg",scrollpages[ri]+"topscroll.jpg"):cntmpt.src.replace(scrollpages[ri]+"topscroll.jpg",scrollpages[ri]+"notopscroll.jpg");
  cntmpb.src=(chkvar)?cntmpb.src.replace(scrollpages[ri]+"nobottomscroll.jpg",scrollpages[ri]+"bottomscroll.jpg"):cntmpb.src.replace(scrollpages[ri]+"bottomscroll.jpg",scrollpages[ri]+"nobottomscroll.jpg");

}
}

//-->
</script>
Avatar billede jhe-ting Nybegynder
27. september 2007 - 06:12 #15
Mere effektivt ville være at slukke for timer-rutinerne når der ikke er brug for dem (onmouseout) og starte dem når de er i brug (onmouseover).

Hvis du ellers kan bruge den rene script-ændring er det så også i orden.

Hvis der er problemer med scriptet, kan det skyldes at din kode ikke er XHTML men HTML.

Jeg testede med denne headder:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
Avatar billede prodoc Nybegynder
27. september 2007 - 10:34 #16
Jaaa så virker det! Men der er dog et par småbugs.. Når een af Main eller Submenu div'en ikke skal bruge scroll så fjerner den det for dem begge (altså scrollbilledet) og noscroll kommer slet ikke frem?
se eventuelt på www.isyvsind.dk
Avatar billede jhe-ting Nybegynder
28. september 2007 - 21:03 #17
Prøv at rette fra:

for(ri=0;ri<scrollpages.length;ri++)scrollheight[ri]=document.getElementById(scrollpages[ri].replace("ID","")).scrollHeight;


til:


for(ri=0;ri<scrollpages.length;ri++)
  scrollheight[ri]=parseInt(
    document.getElementById(
      scrollpages[ri].replace("ID","")
    ).style.height
  );
Avatar billede jhe-ting Nybegynder
28. september 2007 - 21:04 #18
Har prøvet det på siden og set det virke ;)
Avatar billede prodoc Nybegynder
01. oktober 2007 - 00:17 #19
Hejsa undskyld den sene udmelding, har været på weekendtur med min familie (fars 60 års fødselsdag :)) Nu virker det sgu... Det er lidt synd at den lige tager et sek om at opdatere scroll-billeder, men det er der ikke noget at gøre ved... :)

Lige sidst du ved vel ikke hvad jeg skal være for at baggrunden på div'sne igen bliver fixed? altså sådan at de ikke følger med når der scrolles? :)
(Kommer du ikke lige med et svar) :)
Avatar billede jhe-ting Nybegynder
02. oktober 2007 - 01:49 #20
Du kan vist bare fjerne (fra begge divs):

background-attachment:fixed;
background-position: XXpx  YYpx;
Avatar billede prodoc Nybegynder
02. oktober 2007 - 10:02 #21
Hej Jhe-ting, tusind tak for hjælpen, prøvede mig lidt frem i går aftes og fandt ud af det helt selv :) altså det med baggrunden..... Problemet er så bare hvordan jeg centrer min cintainer på siden, men den finder jeg ud af med tiden :)

Igen tusind tak for hjælpen!
Avatar billede jhe-ting Nybegynder
02. oktober 2007 - 22:20 #22
Du kan få den til at opdatere tidligere (måske) hvis du må (for jomla) bruge

  window.onload=scrollHigh;

Så kan du vist endda droppe 'setInterval("scrollhigh();",refreshspeed2);'

};D)
Avatar billede jhe-ting Nybegynder
02. oktober 2007 - 22:29 #23
Mere muligt er det at du kan bruge den lidt tungere løsning:

  var oldWinOnload = window.onload;

  window.onload=function(e){
    if (oldWinOnload) oldWinOnload(e);
    scrollHigh();
  }
Avatar billede prodoc Nybegynder
02. oktober 2007 - 22:38 #24
Skal jeg så bare skrive:
window.onload=scrollHigh;

i stedet for:
setInterval("scrollhigh();",refreshspeed2);

for hvis jeg gør det så forblir scrollOn billedet der og forsvinder ikke?
Avatar billede jhe-ting Nybegynder
04. oktober 2007 - 01:12 #25
Åh - det kan være det varer lidt efter onload før hele jomla-delen er færdig.
Måske er der et jomla-event man kan hægte sig på.
Hvor længe varer det før de forsvinder hvis refreshspeed2 gøres meget lille (10-20 ms.)?
Måske kan du nøjes med en forsinkelse...
Avatar billede prodoc Nybegynder
04. oktober 2007 - 21:37 #26
Heh jeg har faktisk fået overtalt en ven til at hjælpe mig med at lave et lille frontend cms, så jeg undgår Joomla... :) jeg synes godt nok det har været lidt svært at bruge det joomla, specielt fordi det system som jeg vil have på min side tit går væk fra Joomla, altså der er menuen som ikke er en del af Joomla etc...
Men ja har sat refreshspeed2 til 5 ms, så er det da næsten usynligt... det er nok det bedste jeg kan få... :)
Tusind tak, det med at baggrunden kan scrolles ned prøver jeg at spørge min ven om når vi i weekenden skal have programmeringsweekend... :)

Tak for hjælpen og good weekend!
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
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel Indlæg Oprettet Seneste aktivitet
Variabler som ikke virker Af Frits Jensen i HTML 2 30/10/202409:37 30/10/202413:04
Aldersbegrænsning på min hjemmeside Af ØLMANDEN i HTML 2 29/09/202410:58 30/09/202412:04
Bredde på div elementer Af dane022 i HTML 2 16/02/202408:29 20/02/202412:50
Hvilken mindste mobilstørrelse til hjemmeside Af CSharpRazor i HTML 2 21/12/202322:51 22/12/202308:03
validering <input tlfnr. Af slein55 i HTML 5 15/10/202311:43 15/10/202314:51
Se alle spørgsmål i kategorien Opret spørgsmål

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.

Opret Log ind

Du kan også logge ind via nedenstående tjenester



Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I dag 09:44 Mine emails kan pluselig ikke læses af modtagerne, kun uforståelige tal og bogstaver Af gunnarb i E-mail programmer
I går 16:03 Fjern "Seneste" - "Hurtig adgang" Fra Windows 11 - Hvordan ? Af Ikke-ekspert i Windows
23/1214:43 html <Input.. Danske bogstaver Af pjotre i Andet software
23/1214:35 Brænde musik fra usb drev til cd Af Caso i Andet hardware
21/1222:16 Er "OneDrive" et "Must" ? Koster det penge ? Af Ikke-ekspert i Windows
White papers
Flere white papers »


Premium
Teaser billede
Historisk million-bøde får Region Syddanmarks it-direktør til at efterlyse nye GDPR-retningslinjer
Læs mere »
Ser med 'stor alvor' på problemer med vand, varme og manglende kontrol i politiets datacenter
Brugere rammes af Microsoft-fejl: M365-produkter er på mystisk vis blevet deaktiveret
Overblik: Danske it-selskaber strømmer ind mod den centrale storby - og det handler ikke om penge
Se alle »
Computerworld
Teaser billede
Netværkstest: Første mesh-sæt med komplette WiFi 7-features sætter nye rekorder for dækning og hastighed
Læs mere »
Til næste år kommer iPhone 17 – og ifølge rygtestrømmene vil den byde på tre nyheder
Her er dommen: Region Syddanmark skal betale historisk stor bøde for grove overtrædelser af GDPR
Nørgaard: Copilot scorer pænt højt i min kendte 3D-test (Dyrt, Dumt, Dårligt)
Se alle »
CIO
Teaser billede
Dansk headhunter: Dette spørgsmål bliver jeg næsten altid stillet, når jeg forsøger at rekruttere it-folk
Læs mere »
En af verdens største it-distributører dropper samarbejdet med Broadcom: Kunne ikke nå til enighed
Software-selskabernes prisstigninger får nu danske virksomheder til at søge mod open source
AI er et falmende buzzword: Lad mig fluks dele en god og en dårlig nyhed
Se alle »
Job & Karriere
Teaser billede
Microsoft klar med ny direktion for den danske forretning: Her er de nye direktører
Læs mere »
Merete Søby klar med nyt top-job efter pludselig exit fra Schultz: Her er hendes nye job
Linus Torvalds giver russiske Linux-udviklere sparket: Vil ikke have noget med dem at gøre
Dansk headhunter: Dette spørgsmål bliver jeg næsten altid stillet, når jeg forsøger at rekruttere it-folk
Se alle »
White paper
Teaser billede
Managed Detection & Response: Forsvar din virksomhed mod cybertrusler døgnet rundt
Læs mere »
Cyberangreb bliver mere kostbare: Er du forberedt?
Sæt turbo på din cloudperformance og minimér risikoen for DDoS-angreb
Derfor kræver AI, cloud og sikkerhed et stærkere netværk
Se alle »

Events
Flere events »
White papers
Flere white papers »
IT-Kurser
Se alle vores it-kurser »