aan alle goede dingen komt een eind, webmasterplein.net 2003 - 2013
wij danken jullie voor al mooie momenten die dankzij dit forum ontstonden - Derk, Rutger en Stef

Script.aculo.us

Het echte opmaakwerk, alles vragen over HTMLen, CSSen en Javascripten.

Script.aculo.us

Berichtdoor Johan » 28 sep 2008 12:49

Nou kijk. Script.aculo.us werkt niet helemaal. :( Het effect wat ik wil bereiken is dat een box (nog niet als box te zien) verdwijnt, en er nieuwe tekst komt inrollen. Hiervoor heb ik de volgende code:

Code: Selecteer alles
            <!-- This content won't be viewed first, but if someone downloads the MultiManage pack, this text will open! -->
            <div id="blind" style="display:none; width:280px; height: 500px;">
               <h3>Starten met MultiManage</h3><br />
               <p>Goed dat je ook MultiManage gaat gebruiken! Je kan nu beginnen met het maken van jouw website, zonder codes te (laten) maken!<br /><br />
   
               Als je vragen of opmerkingen hebt, kan je deze plaatsen in onze <a href="http://multimanage.dotbas.net/forums/">forums</a>!<br />
               Veel succes met MultiManage!</p><br /><br />
   
               <a href="http://multimanage.dotbas.net/downloads/">Keer terug naar het downloadsoverzicht..</a>
            </div>
            <!-- So, the hidden box is done -->
            
            <!-- No, not just a div, a special div! The div will disappear, if the download is clicked! -->
            <div id="download">
               <h3>Laatste stabiele versie</h3><br />
               <!--http://multimanage.dotbas.net/downloads/multimanage/1.0.x/nl/multimanage.zip --><a href="#" onclick="new Effect.Opacity('download', { from: 1, to: 0 }); Effect.BlindDown('blind');">MultiManage 1.0.x Nederlands</a>
               <span class="date">Beschikbaar sinds 11-11-0011</span>
            </div>



En ja, in de header roep ik het wel aan! :P
Code: Selecteer alles
<script src="javascript/src/scriptaculous.js" type="text/javascript"></script>



Nou, het resultaat is: http://multimanage.dotbas.net/HOMEPAGE-TIJDELIJK.html

Bij 'Laatste stabiele versie' moet MultiManage 1.0.x Nederlands de actie aanzetten, zoals te zien in mijn .html-codes ;)



Hoe kan dit, en hoe kan het wel gaan werken? ;)
Avatar gebruiker
Johan
wmpr
 
Berichten: 676
Geregistreerd: 07 jan 2008 15:42

Re: Script.aculo.us

Berichtdoor Johan » 28 sep 2008 18:48

Hmm, moet naar HTML, CSS en JavaScript toch? :oops:
Avatar gebruiker
Johan
wmpr
 
Berichten: 676
Geregistreerd: 07 jan 2008 15:42

Re: Script.aculo.us

Berichtdoor Stef » 28 sep 2008 20:20

Heb je ook prototype.js ophalen.
Avatar gebruiker
Stef
wmpr
 
Berichten: 5575
Geregistreerd: 27 nov 2003 21:51

Re: Script.aculo.us

Berichtdoor libia » 29 sep 2008 14:03

ik snap niet helemaal wat je wilt..
Maar je kunt toch
Code: Selecteer alles
document.getElementById("id").innerHTML = "nieuwe tekst";

Doen??
Avatar gebruiker
libia
wmpr
 
Berichten: 4149
Geregistreerd: 23 okt 2005 14:14
Woonplaats: Alphe!!

Re: Script.aculo.us

Berichtdoor Johan » 29 sep 2008 14:28

Stef schreef:Heb je ook prototype.js ophalen.

Nope, nog niet opgehaald. Moet die apart? Hij staat nu ook in de map /javascript/src, is dat genoeg? Werkt namelijk nog niet.

libia schreef:ik snap niet helemaal wat je wilt..
Maar je kunt toch
Code: Selecteer alles
document.getElementById("id").innerHTML = "nieuwe tekst";

Doen??

Euhm.. geen idee :oops: ik kan geen JS. ;)
Avatar gebruiker
Johan
wmpr
 
Berichten: 676
Geregistreerd: 07 jan 2008 15:42

Re: Script.aculo.us

Berichtdoor libia » 29 sep 2008 14:34

kun je misschien uitleggen wat je precies wilt?
Avatar gebruiker
libia
wmpr
 
Berichten: 4149
Geregistreerd: 23 okt 2005 14:14
Woonplaats: Alphe!!

Re: Script.aculo.us

Berichtdoor Johan » 29 sep 2008 14:44

Oké:

Ik wil een rechthoekige box maken, waarin een download link staat. Zodra iemand de downloadlink aanklikt, vervaagt de box, en rolt er een stuk tekst uit waar wat informatie in staat over de download. ;)

Bijvoorbeeld: phpBB.nl Downloads. :P
Avatar gebruiker
Johan
wmpr
 
Berichten: 676
Geregistreerd: 07 jan 2008 15:42

Re: Script.aculo.us

Berichtdoor libia » 29 sep 2008 15:22

en waar moet die info staan? In een array, een onzichtbare div of moet het nog opgehaald worden?
Avatar gebruiker
libia
wmpr
 
Berichten: 4149
Geregistreerd: 23 okt 2005 14:14
Woonplaats: Alphe!!

Re: Script.aculo.us

Berichtdoor Johan » 29 sep 2008 15:40

onzichtbare div is het handigst, maar als het anders ook kan.. het is enkel tekst met linkjes. :D
Avatar gebruiker
Johan
wmpr
 
Berichten: 676
Geregistreerd: 07 jan 2008 15:42

Re: Script.aculo.us

Berichtdoor Johan » 29 sep 2008 18:54

Stef schreef:Heb je ook prototype.js ophalen.

Nu gedaan, dmv de code in header veranderen en src aanpassen. Werkt alleen nog niet. :cry:
Nu ook unittest.js apart gedaan, net als phpBB.nl. Geen reultaat. En zelfs met de phpBB.nl broncode niet :S
Avatar gebruiker
Johan
wmpr
 
Berichten: 676
Geregistreerd: 07 jan 2008 15:42

Re: Script.aculo.us

Berichtdoor libia » 30 sep 2008 16:12

kun je hier misschien iets mee?

Code: Selecteer alles
<html>
   <head>
      <title>Testje</title>
      <script type="text/javascript" src="script.js"></script>
      <style type="text/css">
      .downloadBox {
         width: 500px;
         height: 200px;
         border: 1px solid #00AA00;
         background: #00FF00;
      }
      #link1, #info1 {
         float: left;
         clear: both;
         overflow: hidden;
      }
      </style>
   </head>
   <body>
      <div class="downloadBox"><div id="link1" onclick="showInfo('link1', 'info1')" style="opacity: 1;">Klik hier!</div><div id="info1" style="height: 0%; width: 100%;">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi aliquam, risus et lacinia tristique, neque quam faucibus sem, id viverra nulla nunc ut tortor. Fusce orci ligula, varius at, sollicitudin eget, elementum sed, odio. Fusce eu est eget risus rutrum suscipit. Duis odio ligula, lobortis eu, porta vel, fermentum ac, purus. Aenean lorem. Donec lacinia facilisis turpis. Vestibulum aliquam consectetuer libero. Vivamus arcu. Vivamus tristique pretium sapien. Mauris vitae velit. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent cursus risus sed sem sodales feugiat. Nulla facilisi. Nulla tincidunt lectus et ante aliquet feugiat. Curabitur hendrerit mattis dolor. Sed iaculis metus sed arcu. Pellentesque porta. Donec elementum orci id elit. Proin augue ante, ullamcorper facilisis, bibendum vitae, consectetuer vitae, sapien. Nulla ultricies semper diam.</div></div>
   </body>
</html>


en script.js

Code: Selecteer alles
function showInfo(linkId, infoId)
{
   fade(linkId, infoId);
}

function fade(linkId, infoId)
{
   var link = document.getElementById(linkId);
   
   var op = link.style.opacity;
   if(op > 0)
   {
      link.style.opacity = op - 0.05;
      link.style.filter = "alpha(opacity=" + (op - 0.1)*100 + ")";
   }
   
   if(op - 0.05 > 0)
   {
      setTimeout('fade("' + linkId + '", "' + infoId + '")', 40);
   }
   else
   {
      link.style.height = "0px";
      scroll(infoId);
   }
}

function scroll(infoId)
{
   var info = document.getElementById(infoId);
   
   var height = parseInt(info.style.height);
   
   if(height < 100)
   {
      info.style.height = height + 5 + "%";
      if(height + 1 > 100)
      {
         info.style.height = "100%";
      }
   }
   
   if(height + 1 < 100)
   {
      setTimeout('scroll("' + infoId + '")', 40);
   }
}
Avatar gebruiker
libia
wmpr
 
Berichten: 4149
Geregistreerd: 23 okt 2005 14:14
Woonplaats: Alphe!!

Re: Script.aculo.us

Berichtdoor Johan » 30 sep 2008 18:16

Wauw, bedankt! Hiermee kan ik leuk verder knutselen. :D


_O_ _O_ _O_ _O_ _O_
Avatar gebruiker
Johan
wmpr
 
Berichten: 676
Geregistreerd: 07 jan 2008 15:42

Re: Script.aculo.us

Berichtdoor libia » 30 sep 2008 18:33

graag gedaan :D
Avatar gebruiker
libia
wmpr
 
Berichten: 4149
Geregistreerd: 23 okt 2005 14:14
Woonplaats: Alphe!!

Re: Script.aculo.us

Berichtdoor Johan » 30 sep 2008 18:42

Ben al druk aan het devven. :D
Avatar gebruiker
Johan
wmpr
 
Berichten: 676
Geregistreerd: 07 jan 2008 15:42

Re: Script.aculo.us

Berichtdoor Stef » 30 sep 2008 19:51

Johan schreef:
Stef schreef:Heb je ook prototype.js ophalen.

Nu gedaan, dmv de code in header veranderen en src aanpassen. Werkt alleen nog niet. :cry:
Nu ook unittest.js apart gedaan, net als phpBB.nl. Geen reultaat. En zelfs met de phpBB.nl broncode niet :S


Je moet ook het pakket van script.aculo.us downloaden. ;-) Maar het is je al gelukt en daar zijn we blij om.
Avatar gebruiker
Stef
wmpr
 
Berichten: 5575
Geregistreerd: 27 nov 2003 21:51

Re: Script.aculo.us

Berichtdoor Johan » 01 okt 2008 15:47

Die had ik al gedownload Stef. :}
Avatar gebruiker
Johan
wmpr
 
Berichten: 676
Geregistreerd: 07 jan 2008 15:42


Keer terug naar HTML, CSS, Javascript



cron