Avatar billede mason Nybegynder
05. december 2002 - 14:12 Der er 8 kommentarer og
1 løsning

Scroll funktion i tables med egne scroll knapper ???

Jeg har lavet scroll funktioner i layers.
Jeg har lavet scroll funktioner i tables med iframe.
Fint!

Men jeg vil gerne lave en scroll funktion i en table med mine egne op og ned pile.

Altså ingen grå standard bar, slider og ramme!
Kun mine egne to stykker grafik med en "pil op" og en "pil ned" som scroller min brødtekst henholdsvis op og ned.

Er der nogen hjælp at hente her ???
Avatar billede hacicambaz Nybegynder
05. december 2002 - 16:27 #1
http://www.lindepartners.com/signe/cv.htm


højre klik viskilde: pilop.gif  -  pilned.gif 

alt hvad du skal bruge stå imelem disse to gif. filer.
Avatar billede hacicambaz Nybegynder
05. december 2002 - 16:30 #2
eller kig på denne her sider venstre side... øverst til højre.. http://www.prikdk.dk/
Avatar billede mason Nybegynder
06. december 2002 - 10:44 #3
Hej Hacicambaz.

Tak for linket - jeg har kigget lidt på din kode under dit CV - det er nemlig lige præcis sådan jeg selv skal have det.
Men jeg er ikke helt med på præcis hvilken del jeg skal bruge.
Kan du være lidt mere specifik, og sige hvor meget af koden jeg skal bruge, og om jeg bare kan smide det direkte ind i min egen table?
Avatar billede cygnet Praktikant
08. december 2002 - 22:32 #4
Avatar billede mason Nybegynder
09. december 2002 - 10:02 #5
Oh, tak for det, jeg kigger lidt på det :-) Og så vender jeg tilbage.
Avatar billede mason Nybegynder
09. december 2002 - 12:12 #6
Æv, det virker jo kun i layers!
Jeg skal lave det i en celle i en table.....
Anyone.....????

Hvordan laver man en scroll funktion i en TABLE? med sine egne scroll pile
Avatar billede hacicambaz Nybegynder
23. december 2002 - 19:07 #7
<TD STYLE="height:100px;width:100px;"><DIV CLASS="scroll" style="width:100px;height: 100px;overflow:scroll;overflow-x : hidden;">dit indhold
</DIV></TD>
Avatar billede hacicambaz Nybegynder
23. december 2002 - 19:23 #8
find to gif filer /// pilop.gif  -  pilned.gif 

Gem den nederste script/ som  test.htm



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML>


<HEAD>
<TITLE>http://sivas.dk</TITLE>
<META content="text/html; charset=iso-8859-1" http-equiv=Content-Type>
<STYLE type=text/css>BODY {
    COLOR: #000000; FONT-FAMILY: verdana; FONT-SIZE: 12px; TEXT-DECORATION: none
}
TD {
    COLOR: #000000; FONT-FAMILY: verdana; FONT-SIZE: 12px; TEXT-DECORATION: none
}
A {
    COLOR: #184118; FONT-FAMILY: verdana; FONT-SIZE: 12px; TEXT-DECORATION: none
}
A:hover {
    COLOR: #82372B; FONT-FAMILY: verdana; FONT-SIZE: 12px; TEXT-DECORATION: none
}
</STYLE>

<style type="text/css"> 
#divUpControl{width:380; left:10; top:10; z-index:1; text-align: right}
#divDownControl{width:380; left:10; top:10; z-index:1; text-align: right}
#divContainer{width:355; height:170; overflow:hidden; top:100; left:30; clip:rect(0,220,220,0); visibility:hidden}
#divContent{position:relative}
</style>

<script language="JavaScript">

function verifyCompatibleBrowser(){
    this.ver=navigator.appVersion
    this.dom=document.getElementById?1:0
    this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom)?1:0;
    this.ie4=(document.all && !this.dom)?1:0;
    this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0;

    this.ns4=(document.layers && !this.dom)?1:0;
    this.bw=(this.ie5 || this.ie4 || this.ns4 || this.ns5)
    return this
}
bw=new verifyCompatibleBrowser()

var speed=70
var loop, timer

function ConstructObject(obj,nest){
    nest=(!nest) ? '':'document.'+nest+'.'
    this.el=bw.dom?document.getElementById(obj):bw.ie4?document.all[obj]:bw.ns4?eval(nest+'document.'+obj):0;
    this.css=bw.dom?document.getElementById(obj).style:bw.ie4?document.all[obj].style:bw.ns4?eval(nest+'document.'+obj):0;
    this.scrollHeight=bw.ns4?this.css.document.height:this.el.offsetHeight
    this.clipHeight=bw.ns4?this.css.clip.height:this.el.offsetHeight
    this.up=MoveAreaUp;this.down=MoveAreaDown;
    this.MoveArea=MoveArea; this.x; this.y;
    this.obj = obj + "Object"
    eval(this.obj + "=this")
    return this
}
function MoveArea(x,y){
    this.x=x;this.y=y
    this.css.left=this.x
    this.css.top=this.y
}

function MoveAreaDown(move){
    if(this.y>-this.scrollHeight+objContainer.clipHeight){
    this.MoveArea(0,this.y-move)
    if(loop) setTimeout(this.obj+".down("+move+")",speed)
    }
}
function MoveAreaUp(move){
    if(this.y<0){
    this.MoveArea(0,this.y-move)
    if(loop) setTimeout(this.obj+".up("+move+")",speed)
    }
}

function PerformScroll(speed){
    if(initialised){
        loop=true;
        if(speed>0) objScroller.down(speed)
        else objScroller.up(speed)
    }
}

function CeaseScroll(){
    loop=false
    if(timer) clearTimeout(timer)
}
var initialised;
function InitialiseScrollableArea(){
    objContainer=new ConstructObject('divContainer')
    objScroller=new ConstructObject('divContent','divContainer')
    objScroller.MoveArea(0,0)
    objContainer.css.visibility='visible'
    initialised=true;
}

</script>





<script language="JavaScript">
<!--


function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function tmt_findObj(n){
    var x,t; if((n.indexOf("?"))>0&&parent.frames.length){t=n.split("?");
    x=eval("parent.frames['"+t[1]+"'].document.getElementById('"+t[0]+"')");
    }else{x=document.getElementById(n)}return x;
}
//-->
</script>
<script language="JavaScript">
<!--
<!--
function MM_reloadPage(init) {  //reloads the window if Nav4 resized
  if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
// -->

function P7_autoLayers() { //v1.2 by PVII
var g,b,k,f,args=P7_autoLayers.arguments;
var a = parseInt(args[0]);if(isNaN(a))a=0;
if(!document.p7setc) {p7c=new Array();document.p7setc=true;
  for (var u=0;u<10;u++) {p7c[u] = new Array();}}
for(k=0; k<p7c[a].length; k++) {
  if((g=MM_findObj(p7c[a][k]))!=null) {
  b=(document.layers)?g:g.style;b.visibility="hidden";}}
for(k=1; k<args.length; k++) {
  if((g=MM_findObj(args[k])) != null) {
  b=(document.layers)?g:g.style;b.visibility="visible";f=false;
  for(j=0;j<p7c[a].length;j++) {
    if(args[k]==p7c[a][j]) {f=true;}}
  if(!f) {p7c[a][p7c[a].length++]=args[k];}}}
}

function P7_Snap() { //v2.62 by PVII
  var x,y,ox,bx,oy,p,tx,a,b,k,d,da,e,el,args=P7_Snap.arguments;a=parseInt(a);
  for (k=0; k<(args.length-3); k+=4)
  if ((g=MM_findObj(args[k]))!=null) {
    el=eval(MM_findObj(args[k+1]));
    a=parseInt(args[k+2]);b=parseInt(args[k+3]);
    x=0;y=0;ox=0;oy=0;p="";tx=1;da="document.all['"+args[k]+"']";
    if(document.getElementById) {
    d="document.getElementsByName('"+args[k]+"')[0]";
    if(!eval(d)) {d="document.getElementById('"+args[k]+"')";if(!eval(d)) {d=da;}}
    }else if(document.all) {d=da;}
    if (document.all || document.getElementById) {
    while (tx==1) {p+=".offsetParent";
      if(eval(d+p)) {x+=parseInt(eval(d+p+".offsetLeft"));y+=parseInt(eval(d+p+".offsetTop"));
      }else{tx=0;}}
    ox=parseInt(g.offsetLeft);oy=parseInt(g.offsetTop);var tw=x+ox+y+oy;
    if(tw==0 || (navigator.appVersion.indexOf("MSIE 4")>-1 && navigator.appVersion.indexOf("Mac")>-1)) {
      ox=0;oy=0;if(g.style.left){x=parseInt(g.style.left);y=parseInt(g.style.top);
      }else{var w1=parseInt(el.style.width);bx=(a<0)?-5-w1:-10;
      a=(Math.abs(a)<1000)?0:a;b=(Math.abs(b)<1000)?0:b;
      x=document.body.scrollLeft + event.clientX + bx;
      y=document.body.scrollTop + event.clientY;}}
  }else if (document.layers) {x=g.x;y=g.y;var q0=document.layers,dd="";
    for(var s=0;s<q0.length;s++) {dd='document.'+q0[s].name;
    if(eval(dd+'.document.'+args[k])) {x+=eval(dd+'.left');y+=eval(dd+'.top');break;}}}
  if(el) {e=(document.layers)?el:el.style;
  var xx=parseInt(x+ox+a),yy=parseInt(y+oy+b);
  if(navigator.appName=="Netscape" && parseInt(navigator.appVersion)>4){xx+="px";yy+="px";}
  if(navigator.appVersion.indexOf("MSIE 5")>-1 && navigator.appVersion.indexOf("Mac")>-1){
    xx+=parseInt(document.body.leftMargin);yy+=parseInt(document.body.topMargin);
    xx+="px";yy+="px";}e.left=xx;e.top=yy;}}
}

function MM_openBrWindow(theURL,winName,features) { //v2.0
  window.open(theURL,winName,features);
}
//-->
</script>
</HEAD>



<BODY onLoad="InitialiseScrollableArea()" bgColor=#008080 leftMargin=0 marginheight="0" marginwidth="0">


<table width="650" border="0" cellspacing="0" cellpadding="0" height="100%" align="center">
  <tr>
    <td align="center">
      <table align=center border=0 cellpadding=0 cellspacing=0
      width=650>
        <tbody>
        <tr>
          <td bgcolor=#dddbca height=165 valign=top width="463">
          <table width="365" border="0" cellspacing="0" cellpadding="0" align="center" height="230">
              <tr valign="top">
                <td>
                  <div id="divUpControl"> <a href="java script:;" onMouseOver="PerformScroll(-7)" onMouseOut="CeaseScroll()"><br>
                    </a>
                    <table width="100%" border="0" cellspacing="0" cellpadding="0">
                      <tr>
                        <td width="32%"><font color="82372B"><b>Sivas</b></font></td>
                        <td width="61%">
                          <div align="right"><a href="#" onClick="MM_openBrWindow('cv_pop.htm','','scrollbars=yes,width=425,height=500')"><font size="1">http://sivas.dk</font></a></div>
                        </td>
                        <td width="7%">
                          <div align="right"><a href="java script:;" onMouseOver="PerformScroll(-7)" onMouseOut="CeaseScroll()"><img src="pilop.gif" width="19" height="17" border="0"></a></div>
                        </td>
                      </tr>
                    </table>
                    <div align="right"><br>
                    </div>
                  </div>
                  <div id="divContainer">
                    <div id="divContent">
                      <table width="100%" border="0" cellspacing="0" cellpadding="0">
                        <tr>
                          <td width="28%"><font color="82372B"><b>Sivas</b></font>
                            <br>
                          </td>
                          <td width="72%">&nbsp;</td>
                        </tr>
                        <tr>
                          <td width="28%" valign="top">test</td>
                          <td rowspan="4" valign="top" width="72%">
                            <p>test <a href="http://sivas.dk">http://sivas.dk</a>
                            test</p>
                            <p>test <a href="http://sivas.dk">http://sivas.dk</a>
                            test</p>
                            <p>test <a href="http://sivas.dk">http://sivas.dk</a>
                            test</p>
                            <p>test <a href="http://sivas.dk">http://sivas.dk</a>
                            test</p>
                          </td>
                        </tr>
                        <tr>
                          <td width="28%">&nbsp;</td>
                        </tr>
                        <tr>
                          <td width="28%">&nbsp;</td>
                        </tr>
                        <tr>
                          <td width="28%" height="2">&nbsp;</td>
                        </tr>
                        <tr>
                          <td width="28%">&nbsp;</td>
                          <td width="72%">&nbsp;</td>
                        </tr>
                        <tr>
                          <td width="28%">test</td>
                          <td width="72%"><b>www.sivas.dk</b></td>
                        </tr>
                        <tr>
                          <td width="28%" height="13">&nbsp;</td>
                          <td height="13" width="72%">
                            <dl>
                              <dt>&nbsp;</dt>
                              <dt>Sivas er en by i tyrkiet</dt>
                              <dt>Sivas er en by i tyrkiet</dt>
                              <dt>Sivas er en by i tyrkiet</dt>
                            </dl>
</td>
                        </tr>
                        <tr>
                          <td width="28%">&nbsp;</td>
                          <td width="72%">&nbsp;</td>
                        </tr>
                      </table>
                      <p>
                        <br>
                    </div>
                  </div>
                  <div id="divDownControl">
                    <div align="right"><a href="java script:;" onMouseOver="PerformScroll(7)" onMouseOut="CeaseScroll()"><img src="pilned.gif" width="19" height="17" border="0"></a>
                    </div>
                  </div>
                </td>
              </tr>
            </table>
          </td>
        </tr>
        </tbody>
      </table>
    </td>
  </tr>
</table>
</BODY></HTML>
Avatar billede mason Nybegynder
12. februar 2003 - 14:31 #9
s
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
Kurser inden for grundlæggende programmering

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