Meddelande

Minska
No announcement yet.

Kombinera två script?!!

Minska
X
Minska
 
  • Page of 2
  • Filter
  • Klockan
  • Show
Clear All
new posts
Föregående 1 2 template Nästa
  • #16
    Nu till nästa problem... haha.. jag får aldrig nog!!!

    Nu vill jag på något sätt impletera det i det andra scriptet... typ som jag gjort neden... förutom att det jag gjort inte fungerar.. men du kanske förstår min tanke...

    [kod]
    <html>
    <head>
    <title>xxx</title>
    <script type="text/javascript">
    var g_tmr = null;
    var g_opacity = 0;

    function show(obj, elmId) {
    if(obj.timeout)
    clearTimeout(obj.timeout);

    document.getElementById(elmId).style.display = "block";
    g_tmr = null;
    g_opacity = 100;
    fade(elmId,10);
    }

    function hide(obj, elmId) {
    g_tmr = null;
    g_opacity = 100;
    fade(elmId,10);
    obj.timeout = setTimeout(function(){ close(elmId) }, 500);
    }

    function close(elmId) {
    document.getElementById(elmId).style.display = "none";
    }

    function fade( p_id, p_diff )
    {
    if ( g_tmr )
    clearTimeout( g_tmr );

    g_opacity += p_diff;
    if ( g_opacity > 100 )
    g_opacity = 100;
    else if ( g_opacity < 0 )
    g_opacity = 0;

    document.getElementById( p_id ).style.visibility = "visible";

    if ( document.getElementById && document.all )
    document.getElementById( p_id ).style.filter = "alpha(opacity="+g_opacity+")";
    else if ( document.getElementById && !document.all )
    document.getElementById( p_id ).style.MozOpacity = g_opacity / 100;

    if ( g_opacity > 0 && g_opacity < 100 )
    g_tmr = setTimeout( "fade('"+p_id+"',"+p_diff+");", 10 );
    else if ( 0 == g_opacity )
    document.getElementById( p_id ).style.visibility = "visible";
    }

    </script>

    <style type="text/css">
    .ny { position: absolute; left: 350px; width:200; display: none; background: #ccc; }
    </style>

    </head>
    <body>

    <table>
    <tr>
    <td><span onmouseover="show(this, 'e01')" onmouseout="hide(this, 'e01')">Bild</span></td>
    <td><div class="ny" id="e01">Extra text</div>
    Lite mer text som delvis döljs när extra-texten syns.</td>
    </tr>
    <tr>
    <td><span onmouseover="show(this, 'e02')" onmouseout="hide(this, 'e02')">Bild</span></td>
    <td><div class="ny" id="e02">Extra text</div>
    Lite mer text som delvis döljs när extra-texten syns.</td>
    </tr>
    <tr>
    <td><span onmouseover="show(this, 'e03')" onmouseout="hide(this, 'e03')">Bild</span></td>
    <td><div class="ny" id="e03">Extra text</div>
    Lite mer text som delvis döljs när extra-texten syns.</td>
    </tr>
    </table>
    </body>

    </html>
    [/kod]
    ----------------------------------
    Tommie "toja" Jakobsson
    www.stambokaj.se

    Kommentera

    • #17
      Ähh... knäckte en bärs nu jag me..!!
      ----------------------------------
      Tommie "toja" Jakobsson
      www.stambokaj.se

      Kommentera

      • #18
        jawbreaker... jag vet att du kan detta också... kom igen nu...!!! Hehe.. sympatidricker tillochmed bärs för din skull...
        ----------------------------------
        Tommie "toja" Jakobsson
        www.stambokaj.se

        Kommentera

        • #19
          Vänta föresten med vad jag skrev innan.. kom på att det kanske går att lösa på annat sätt.. men återkommer till det...

          Detta däremot är en svaghet med ditt script jawbreaker!

          [kod]
          <html>
          <head>
          <title>xxx</title>
          </head>
          <body>

          <a href="javascriptade('fadea', 10);">Visa lager 1</a> <a href="javascriptade('fadea', -10);">dölj lager 1</a><br>
          <a href="javascriptade('fadeb', 10);">Visa lager 1</a> <a href="javascriptade('fadeb', -10);">dölj lager 1</a>
          <br>
          <br>
          <div id="fadea" style="position:absolute;top:100px;left:100px;visibilityidden;"><img src="http://www.webforum.nu/images/wfstandard/logo_webforum.gif"></div>
          <div id="fadeb" style="position:absolute;top:100px;left:350px;visibilityidden;"><img src="http://www.webforum.nu/images/wfstandard/logo_webforum.gif"></div>

          <script type="text/javascript">
          var g_tmr = null;
          var g_opacity = 0;

          function fade( layid, diff )
          {
          if ( g_tmr )
          clearTimeout( g_tmr );

          g_opacity += diff;
          if ( 100 < g_opacity )
          g_opacity = 100;
          else if ( 0 > g_opacity )
          g_opacity = 0;

          if ( g_opacity > 0 && g_opacity < 100 )
          {
          if ( document.getElementById && document.all )
          {
          document.getElementById(layid).style.filter = "alpha(opacity="+g_opacity+")";
          }
          else if ( document.getElementById && !document.all )
          {
          document.getElementById(layid).style.MozOpacity = g_opacity/100;
          }

          document.getElementById(layid).style.visibility = "visible";
          g_tmr = setTimeout( "fade('"+layid+"',"+diff+");", 10 );
          }
          }

          </script>


          </body>
          </html>
          [/kod]

          Tror detta spökar...
          var g_tmr = null;
          var g_opacity = 0;

          Funderar på om man kanske kan göra funktionen som en class istället.. eller liknande.. och anropa funktionen med olika "namn" för varje lager som ska visas/döljas ...
          ----------------------------------
          Tommie "toja" Jakobsson
          www.stambokaj.se

          Kommentera

          • #20
            Aldrig blir du nöjd
            Nu har jag mixtrat lite med koden, och voila:
            [KOD]
            <html>
            <head>
            <title>Fader</title>

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

            var g_fdrs = new Array();

            function Fade( p_id )
            {
            this.id = p_id;
            this.obj = document.getElementById( p_id );
            this.tmr = null;
            this.opacity = 0;
            this.diff = 10;
            this.fadeIn = FDR_fadeIn;
            this.fadeOut = FDR_fadeOut;
            this.fade = FDR_fade;
            }

            function FDR_fadeIn()
            {
            this.diff = 10;
            this.obj.style.display = "block";
            this.fade();
            }

            function FDR_fadeOut()
            {
            this.diff = -10;
            this.fade();
            }

            function FDR_fade()
            {
            if ( this.tmr )
            clearTimeout( this.tmr );

            this.opacity += this.diff;
            if ( this.opacity > 100 )
            this.opacity = 100;
            else if ( this.opacity < 0 )
            this.opacity = 0;

            if ( document.getElementById && document.all )
            this.obj.style.filter = "alpha(opacity="+this.opacity+")";
            else if ( document.getElementById && !document.all )
            this.obj.style.MozOpacity = this.opacity / 100;

            if ( this.opacity > 0 && this.opacity < 100 )
            this.tmr = setTimeout( "g_fdrs['" + this.id + "'].fade();", 10 );
            else if ( 0 == this.opacity )
            this.obj.style.display = "none";

            }

            function doOnLoad()
            {
            var d = document.getElementsByTagName( "span" );
            for ( var i = 0; i < d.length; i++ )
            {
            if ( 0 == d.item(i).id.indexOf( "fade" ) )
            {
            var id = d.item(i).id + "_obj";
            g_fdrs[id] = new Fade( id );
            d.item(i).onmouseover = new Function( "g_fdrs['" + id + "'].fadeIn();" );
            d.item(i).onmouseout = new Function( "g_fdrs['" + id + "'].fadeOut();" );
            }
            }
            }

            //-->
            </script>

            <style type="text/css">
            .ny { position: absolute; left: 350px; width:200; display: none; background: #ccc; }
            </style>
            </head>

            <body onload="doOnLoad();">

            <table>
            <tr>
            <td><span id="fade1">Bild</span></td>
            <td><div class="ny" id="fade1_obj">Extra text</div>
            Lite mer text som delvis döljs när extra-texten syns.</td>
            </tr>
            <tr>
            <td><span id="fade2">Bild</span></td>
            <td><div class="ny" id="fade2_obj">Extra text</div>
            Lite mer text som delvis döljs när extra-texten syns.</td>
            </tr>
            <tr>
            <td><span id="fade3">Bild</span></td>
            <td><div class="ny" id="fade3_obj">Extra text</div>
            Lite mer text som delvis döljs när extra-texten syns.</td>
            </tr>
            </table>

            </body>
            </html>
            [/KOD]
            Nu är grejen den att dina span-taggar med onmouseover och onmouseout måste ha ett id som börjar med "fade". Tillhörande div-tagg som ska visas/försvinna måste ha samma id, fast med "_obj" på slutet. Du ser ju i koden hur det ser ut.
            Och om det här inte fungerar så får du ingen mer hjälp förrän imorgon - kvällens öl har tagit ut sin rätt, så nu är det sovdags...
            "OK, that's the last memory leak."

            Kommentera

            • #21
              Haha... nice... skulle precis skriva att jag löst problemet med att visa/dölja flera lager på första functionen... gjorde så här:

              [kod]
              <script type="text/javascript">

              g_tmr = new Array() ;
              g_opacity = new Array() ;

              g_tmr['fadea'] = null ;
              g_opacity['fadea'] = 0 ;
              g_tmr['fadeb'] = null ;
              g_opacity['fadeb'] = 0 ;

              function fade( p_id, p_diff )
              {
              if ( g_tmr[p_id] )
              clearTimeout( g_tmr[p_id] );

              g_opacity[p_id] += p_diff;
              if ( g_opacity[p_id] > 100 )
              g_opacity[p_id] = 100;
              else if ( g_opacity[p_id] < 0 )
              g_opacity[p_id] = 0;

              document.getElementById( p_id ).style.visibility = "visible";

              if ( document.getElementById && document.all )
              document.getElementById( p_id ).style.filter = "alpha(opacity="+g_opacity[p_id]+")";
              else if ( document.getElementById && !document.all )
              document.getElementById( p_id ).style.MozOpacity = g_opacity[p_id] / 100;

              if ( g_opacity[p_id] > 0 && g_opacity[p_id] < 100 )
              g_tmr[p_id] = setTimeout( "fade('"+p_id+"',"+p_diff+");", 10 );
              else if ( 0 == g_opacity[p_id] )
              document.getElementById( p_id ).style.visibility = "hidden";
              }

              </script>
              [/kod]

              Vet inte om det var smidigt eller osmidigt... antar att det inte var smidigt.. men nu ska jag kolla in ditt skript!!!
              ----------------------------------
              Tommie "toja" Jakobsson
              www.stambokaj.se

              Kommentera

              • #22
                Du är en klippa jawbreaker... det verkar fungera alldeles superduer...!!! Ska prova mer i morrn... och se om det äntligen kan bli ett "Acceptera som slutgiltigt svar"... och helt pga min hjälte jawbreaker...

                jawbreaker -om du bor nära stockholm.. så bjussar jag på bärs nån gång!
                ----------------------------------
                Tommie "toja" Jakobsson
                www.stambokaj.se

                Kommentera

                • #23
                  Vaken igen... och provat lite...
                  Jawbreaker... dina prylar fungerar utmärkt...
                  men... som du kanske kan misstänka så vill jag ha detta till en meny... försökte få på något sätt så att om man får musen över lagret som kommer fram.. så ska det stanna kvar.. alltså inte fadeas bort... utan fadeas då bort, när man tar musen från det.. om det då inte är tillbaka på den som "utlöste" första faden...

                  Hehe... kanske låter komplicerat.. men jag tycker inte att det borde vara dramatiskt komplicerat att fixa.. eller.?!!

                  Ändrade lite här.. så att du ser ungefär hur jag menar...

                  [kod]
                  <style type="text/css">
                  .ny { position: absolute; left: 313px; width:200; display: none; background: #ccc; }
                  .old { position: relative; left: 0px; width:300; background: #ececec; }
                  </style>
                  </head>

                  <body onload="doOnLoad();">

                  <table>
                  <tr>
                  <td><div class="ny" id="fade1_obj">Extra text 1</div>
                  <span id="fade1" class="old">Meny variant 1</span></td>
                  </tr>
                  <tr>
                  <td><div class="ny" id="fade2_obj">Extra text 2</div>
                  <span id="fade2" class="old">Meny variant 2</span></td>
                  </tr>
                  <tr>
                  <td><div class="ny" id="fade3_obj">Extra text 3</div>
                  <span id="fade3" class="old">Meny variant 3</span></td>
                  </tr>
                  </table>
                  [/kod]
                  ----------------------------------
                  Tommie "toja" Jakobsson
                  www.stambokaj.se

                  Kommentera

                  • #24
                    Tror det är för mycket i denna tråd nu.. skapar en ny.. med mitt nya problem..!!

                    http://www.webforum.nu/showthread.ph...158&forumid=24

                    Tack för all hjälp Jawbreaker!!!
                    Last edited by toja; 2005-05-30, 15:14.
                    ----------------------------------
                    Tommie "toja" Jakobsson
                    www.stambokaj.se

                    Kommentera

                    Föregående 1 2 template Nästa
                    Working...
                    X