Visualizzazione dei risultati da 1 a 7 su 7

Discussione: due domenade su scroll

  1. #1
    Utente di HTML.it
    Registrato dal
    Jan 2003
    Messaggi
    1,100

    due domenade su scroll

    Ciao!

    sto usando un codice Javascript per un menù a scorrimento con scroll "automatico" su rollover dei tasti
    per semplicità, allego la pagina completa con il codice:

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

    <html>
    <head>
    <title>mainpage KF Technology</title>
    <link rel="stylesheet" type="text/css" href="css/main.css" />

    <style type="text/css">
    #divUp{position:absolute; left:560; top:15}
    #divDown{position:absolute; left:560; top:600}
    #divCont{position:absolute; width:300; height:69; overflow:hidden; top:150; left:560; clip:rect(0,414,211,0); visibility:hidden}
    #divText{position:absolute; top:0; left:0}
    </style>

    <script type="text/javascript" language="JavaScript">
    //Default browsercheck, added to all scripts!
    function checkBrowser(){
    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 checkBrowser()

    //If you want it to move faster you can set this lower:
    var speed=40

    //Sets variables to keep track of what's happening
    var loop, timer

    //Object constructor
    function makeObj(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.e l.offsetHeight
    this.up=goUp;this.down=goDown;
    this.moveIt=moveIt; this.x; this.y;
    this.obj = obj + "Object"
    eval(this.obj + "=this")
    return this
    }
    function moveIt(x,y){
    this.x=x;this.y=y
    this.css.left=this.x
    this.css.top=this.y
    }

    //Makes the object go up
    function goDown(move){
    if(this.y>-this.scrollHeight+oCont.clipHeight){
    this.moveIt(0,this.y-move)
    if(loop) setTimeout(this.obj+".down("+move+")",speed)
    }
    }
    //Makes the object go down
    function goUp(move){
    if(this.y<0){
    this.moveIt(0,this.y-move)
    if(loop) setTimeout(this.obj+".up("+move+")",speed)
    }
    }

    //Calls the scrolling functions. Also checks whether the page is loaded or not.
    function scroll(speed){
    if(loaded){
    loop=true;
    if(speed>0) oScroll.down(speed)
    else oScroll.up(speed)
    }
    }

    //Stops the scrolling (called on mouseout)
    function noScroll(){
    loop=false
    if(timer) clearTimeout(timer)
    }
    //Makes the object
    var loaded;
    function scrollInit(){
    oCont=new makeObj('divCont')
    oScroll=new makeObj('divText','divCont')
    oScroll.moveIt(0,0)
    oCont.css.visibility='visible'
    loaded=true;
    }
    //Call the init on page load
    onload=scrollInit;
    </script>

    </head>
    <body>


    <table summary="mainpage KF Technology" width="1024px" height="460px" border="0" cellpadding="0" cellspacing="0">
    <tr>


    <td width="488px" valign="top">


    <div id="divUp" style="left: 470px; top: 20px; width: 16px; height: 440px; overflow: visible">
    <table width="15" height="440" border="0" cellspacing="0" cellpadding="0">
    <tr>
    <td align="left" width="20" height="25" valign="top">
    <a href="#aa" class="itemlink" onMouseOver="scroll(-10)" onMouseOut="noScroll()">
    [img]elementi_grafici/scroll_up.png[/img]</a>
    </td>
    </tr>
    <tr>
    <td align="left" width="20" height="68">

    </td>
    </tr>
    <tr>
    <td align="left" width="20" height="25" valign="bottom">
    <a href="#aa" class="itemlink" onMouseOver="scroll(10)" onMouseOut="noScroll()">
    [img]elementi_grafici/scroll_down.png[/img]</a>
    </td>
    </tr>
    </table>
    </div>


    <table width="100%">
    <tr>
    <td width="160px">



    </td>

    <td width="300px">

    <div id="divCont" style="left: 160px; top: 20px; width: 300px; height: 450px; overflow: hidden; visibility: visible; clip: rect(0 300 450 0)">
    <div id="divText" class="text" style="left: 0px; top: -2px">

    <p class="p1">
    La KF Technology sviluppa e distribuisce attrezzature e servizi
    medico-scientifici, informatici e tecnologici. La nostra attività è
    orientata principalmente nel settore della ricerca scientifica e medica,
    ma trova applicazione anche nell'industria e nel militare, sia da laboratorio
    che da campo.

    Distribuiamo famosi marchi internazionali, apparecchiature biomediche di
    precisione per neuroscienza, biofisica, ricerca farmaceutica.

    Universalmente si usano i nostri sistemi come amplificatori, sistemi di
    perfusione, micromanipolatori, sistemi d'iniezione cellulare, software ed
    accessori per elettrofisiologia, acquisizione immagini ecc.

    </p>
    <p class="p2">
    Narishige, Med Scientific Panasonic, Axon Molecular Devices, Automate,
    Digitimer, Ampi, Kinetics Systems, Syringe Pump, Hum-Bug noise delay, WPI
    Laboratory Equipment, DELL Computer Partner</p>
    <p class="p1">
    sono alcuni dei marchi trattati. Apparecchiature per il monitoraggio
    ambientale e personale: Rilevatori di Radioattività, Gas, Elettrosmog:

    </p>
    <p class="p2">
    Geiger SE, Honeywell Zelana, Sensory Perspective
    </p>
    <p class="p1">
    Dispositivi di Protezione Individuale: Medico, Scientifico, Industriale e
    Militare</p>


    <p class="p2">
    Scott, DuPont
    </p>


    </td>
    </tr>
    </table>


    </td>



    <td width="4px">


    </td>


    <td width="218px" background="elementi_grafici/bg_news.png" valign="top">
    <iframe src="menu/news.htm" name="news_contatti" width="218px" height="460px" frameborder="0" scrolling="no">
    </iframe>
    </td>


    <td width="220px" background="elementi_grafici/bg_partners.png" valign="top">
    <iframe src="menu/partners.htm" name="partners_links" width="218px" height="460px" frameborder="0" scrolling="no">
    </iframe>
    </td>


    <td width="94px" valign="top">

    </td>

    </tr>
    </table>

    </body>
    </html>

    vorrei apportare due modifiche, se possibile, a questo codice che è un po' troppo lungo:
    1- innanzitutto, vorrei sapere se è possibile (e come) accorpare almeno parzialmente il codice, ad esempio in un file esterno da far caricare nella pagina. Devo infatti usare questo menù in numerose pagine, per questo vorrei semplificare il codice facendo riferimento ad un unico file esterno da richiamare, tipo css o simili
    2- vorrei aggiungere una scrollbar al menù, utilizzando dei file grafici personalizzati...è possibile? come?

    grazie mille a tutti!
    ufino

  2. #2
    Utente di HTML.it
    Registrato dal
    Aug 2002
    Messaggi
    8,013
    Rispondo alla prima... il codice è troppo lungo e non ho tempo di provarlo:

    CSS e JS possono essere spostati in due file esterni da includere

    <script language="javascript" type="text/javascript" src="url_file_con_script.js"></script>

    Analoga soluzione per il foglio di stile.
    <´¯)(¯`¤._)(¯`»ANDREA«´¯)(_.¤´¯)(¯`>
    "The answer to your question is: welcome to tomorrow"

  3. #3
    Utente di HTML.it
    Registrato dal
    Jan 2003
    Messaggi
    1,100
    grazie per questa prima risposta!

    aspetto aiuti anche per il secondo problema
    ufino

  4. #4
    Utente di HTML.it
    Registrato dal
    Jan 2003
    Messaggi
    1,100
    ho provato a copiare il testo in un file .js ma evidentemente copio delle stringhe errate...

    quali sono con esattezza le stringhe che devo andare a spostare nel nuovo file?
    il .js deve essere richiamato nel body o nell'head della pagina web?
    ufino

  5. #5
    Utente di HTML.it
    Registrato dal
    Aug 2002
    Messaggi
    8,013
    Fai un file script.js e ci metti dentro

    codice:
    //Default browsercheck, added to all scripts!
    function checkBrowser(){
    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 checkBrowser()
    
    //If you want it to move faster you can set this lower:
    var speed=40
    
    //Sets variables to keep track of what's happening
    var loop, timer
    
    //Object constructor
    function makeObj(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=goUp;this.down=goDown;
    this.moveIt=moveIt; this.x; this.y;
    this.obj = obj + "Object"
    eval(this.obj + "=this")
    return this
    }
    function moveIt(x,y){
    this.x=x;this.y=y
    this.css.left=this.x
    this.css.top=this.y
    }
    
    //Makes the object go up
    function goDown(move){
    if(this.y>-this.scrollHeight+oCont.clipHeight){
    this.moveIt(0,this.y-move)
    if(loop) setTimeout(this.obj+".down("+move+")",speed)
    }
    }
    //Makes the object go down
    function goUp(move){
    if(this.y<0){
    this.moveIt(0,this.y-move)
    if(loop) setTimeout(this.obj+".up("+move+")",speed)
    }
    }
    
    //Calls the scrolling functions. Also checks whether the page is loaded or not.
    function scroll(speed){
    if(loaded){
    loop=true;
    if(speed>0) oScroll.down(speed)
    else oScroll.up(speed)
    }
    }
    
    //Stops the scrolling (called on mouseout)
    function noScroll(){
    loop=false
    if(timer) clearTimeout(timer)
    }
    //Makes the object
    var loaded;
    function scrollInit(){
    oCont=new makeObj('divCont')
    oScroll=new makeObj('divText','divCont')
    oScroll.moveIt(0,0)
    oCont.css.visibility='visible'
    loaded=true;
    }
    //Call the init on page load
    onload=scrollInit;
    Poi nell'head della tua pagina, elimini il tag script e tutto il contenuto che hai adesso e ci metti

    <script language="javascript" type="text/javascript" src="script.js"></script>
    <´¯)(¯`¤._)(¯`»ANDREA«´¯)(_.¤´¯)(¯`>
    "The answer to your question is: welcome to tomorrow"

  6. #6
    Utente di HTML.it
    Registrato dal
    Jan 2003
    Messaggi
    1,100


    grazie!

    primo punto risolto!

    per il secondo punto (aggiunta scrollbar) chi mi può aiutare?!
    ufino

  7. #7
    Utente di HTML.it
    Registrato dal
    Jan 2003
    Messaggi
    1,100
    UP!
    ufino

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.