Scripts - Tutorials - Forum - Downloads - Showcase - Contact

Artikels

VPN vergelijken

Algemeen

Beginpagina

FAQ

Grafische worm (243)

Links

Nieuwsartikels

Nieuwsarchief

Boeken programmeren

Overzicht

Samenwerken

Webhosting

Zoek op Sitemasters

Leden

Registreren

Ledenlijst

Ons team

Links

webhostingtop10.be

Sociale media

Follow @sitemasters

Sitemasters

Adverteren op Sitemasters?

Contacteer ons

RSS

Link naar ons

Donaties

Poll

Je moet ingelogd zijn om te stemmen.

Statistieken

Linkpartners

Forum

Categorieën > JavaScript

moo.fx (Opgelost)

mathiasB - 09/08/2007 23:02 (laatste wijziging 09/08/2007 23:04)

HTML interesse

Ok ik heb dringend hulp nodig. (ik en een vriend

)
We wouden het moo.fx script uitproberen maar het is ons tot heden nog niet gelukt. We lazen deze tutorial maar we geraken er nog steeds niet uit.
Dit zijn de codes: (blijkbaar biedt plaatscode geen html dus..)
Index.html:

html4strict code - Bekijk de code zonder highlighting - Klap code in

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="prototype.lite.js"></script>
<script type="text/javascript" src="moo.fx.js"></script>
<script type="text/javascript" src="moo.fx.pack.js"></script>

 <script type="text/javascript">
window.onload = function() {
	 //fader effect
	 fader = new fx.Opacity('box');
	 $('fade').onclick = function() {
	 	fader.toggle();
		};
</script>
<style>
#box
{
background-color:#FF0000;
color:#FFFFFF;
}
</style>
</head>

<body>

<div id="box">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div>

<p><a id="fade" href="#">Hier nog iets zetten ^^</a></p>
</body>
</html>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="prototype.lite.js"></script>
<script type="text/javascript" src="moo.fx.js"></script>
<script type="text/javascript" src="moo.fx.pack.js"></script>
 
 <script type="text/javascript">
window.onload = function() {
	 //fader effect
	 fader = new fx.Opacity('box');
	 $('fade').onclick = function() {
	 	fader.toggle();
		};
</script>
<style>
#box
{
background-color:#FF0000;
color:#FFFFFF;
}
</style>
</head>
 
<body>
 
<div id="box">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div>
 
<p><a id="fade" href="#">Hier nog iets zetten ^^</a></p>
</body>
</html>

moo.fx.js
moo.fx.pack.js
prototype.lite.js

help???

13 antwoorden

Gesponsorde links

Stijn - 10/08/2007 01:13
PHP expert		html4strict code - Bekijk de code zonder highlighting - Klap code in <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> Zet dit eens op regel 2. Werkt het nog niet? Wat zegt de JS console in firefox?

mathiasB - 10/08/2007 08:54 (laatste wijziging 22/08/2007 20:23)
HTML interesse		nee, werkt ook niet, de tutorial zegt dat het minimum xhtml versie 1.0 zijn... wss ligt daar de fout ergens wel, maar dw plaatste het automatisch (werkte ook niet) en bij het kopieren van de tut ook niet. En uit die js console raak ik niet echt wijs uit Edit: Dit is wat mijn JS console zegt: Citaat: fx.Opacity is not a constructor

BramBo - 23/08/2007 09:38
JS gevorderde		Aangezien ik zelf nooit met Moo gewerkt hebt is het nogal moeilijk om mijn vinger op de pols te leggen. Ik zag bij de tut die je gepost hebt dat er een werkend voorbeeld bijzat. bekijk deze anders eens, controleer op wat er anders is.. http://www.nyokiglitter.com/tutorials/moofxtests#

mathiasB - 23/08/2007 09:50
HTML interesse		Dat is juist het probleem, er is niets!!! anders, ik heb zelfs de code eens gekopieert en geplakt (en links naar js veranderd) dan werkt het zelfs niet

BramBo - 23/08/2007 10:05
JS gevorderde		Je kan me vanalles maar niet A!=A ! dus ik ben zelf maar even gaan rondneuzen. Nu is je init code het zelfde. Maar zijn moo.fx.js is op een of andere manier groter. (zijn er meer packages beschikbaar?) anyway, kijk eens in : http://www.nyokiglitter.com/scripts/moo.fx.js (kopieer deze en ik wed dat het werkt )

mathiasB - 23/08/2007 10:30 (laatste wijziging 23/08/2007 18:42)

HTML interesse

Oke, bedankt ik kijk vanavond even (ben nu op het werk

EN DE FTP WORDT GEBLOKKEERD -zucht- )

Geprobeerd...

BEDANKT!! u ruled
Resultaat (klik op download #1]

maar...

Er staat nog een script op die pagina (qTip) en nu werkt dat niet meer

scripts:

javascript code - Bekijk de code zonder highlighting - Klap code in

                <script language="JavaScript" src="JS/qTip.js" type="text/JavaScript"></script>
<script type="text/javascript" src="JS/prototype.lite.js"></script>
<script type="text/javascript" src="JS/moo.fx.js"></script>
<script type="text/javascript" src="JS/moo.fx.pack.js"></script>
<script type="text/javascript">
window.onload = function() {

	//height effect
	myHeight = new fx.Height('box');
	$('height').onclick = function() {
		myHeight.toggle();
		};
	
	};
</script>
            
<script language="JavaScript" src="JS/qTip.js" type="text/JavaScript"></script>
<script type="text/javascript" src="JS/prototype.lite.js"></script>
<script type="text/javascript" src="JS/moo.fx.js"></script>
<script type="text/javascript" src="JS/moo.fx.pack.js"></script>
<script type="text/javascript">
window.onload = function() {
 
	//height effect
	myHeight = new fx.Height('box');
	$('height').onclick = function() {
		myHeight.toggle();
		};
 
	};
</script>
 

De qTip zorgt ervoor dat er een eigen gemaakte box komt wanneer je over een link gaat.

Pagina waar het niet op werkt.
Pagina waar het wel op werkt.
(ga over de register link op beide pagina's)

bertmelis - 23/08/2007 19:27 (laatste wijziging 23/08/2007 19:28)
PHP interesse		heb totaal geen idee wat er fout zou kunnen zijn, maar: bij qtip gebruik je het language attribuut en staat er bij type Javascript met hoofdletter en bij de andere scripts geen language en alles in kleine letters. long shot?

mathiasB - 23/08/2007 19:46 (laatste wijziging 23/08/2007 20:41)
HTML interesse		Had ik ook al gezien maar geen van beiden maakt een verschil. Maar kheb het verwijderd, alhoewel ik het nog steeds op de info.php pagina gebruik, ook al werkt het niet, misschien kom ik het ooit nog te weten. Bedankt iedereen

BramBo - 24/08/2007 13:27
JS gevorderde		In je <a> van register in de pagina die niet werkt heb je geen title geset. In de andere pagina wel. Als ik dan in qtip.js kijk zie ik dat deze werkt met de title van het a element: php code - Bekijk de code zonder highlighting - Klap code in sTitle = a.getAttribute("title"); if(sTitle) { // !! dit is false op de pagina die niet werkt sTitle = a.getAttribute("title"); if(sTitle) { // !! dit is false op de pagina die niet werkt succes

mathiasB - 24/08/2007 14:28
HTML interesse		Ja ik had hem even verwijderd Nu staat hij er weer maar het werkt nog steeds niet

BramBo - 24/08/2007 15:16 (laatste wijziging 24/08/2007 15:18)

JS gevorderde

ah ja..

op het einde van qTip.js:

php code - Bekijk de code zonder highlighting - Klap code in

                window.onload = function () {
	tooltip.init ();
}
            
window.onload = function () {
	tooltip.init ();
}
 

verwijderen

En in je html file:

php code - Bekijk de code zonder highlighting - Klap code in

                window.onload = function() {

	//height effect
	myHeight = new fx.Height('box');
	$('height').onclick = function() {
		myHeight.toggle();
		};
 }
            
window.onload = function() {
 
	//height effect
	myHeight = new fx.Height('box');
	$('height').onclick = function() {
		myHeight.toggle();
		};
 }
 

wijzigen naar :

php code - Bekijk de code zonder highlighting - Klap code in

                window.onload = function() {

	//height effect
	var myHeight = new fx.Height('box');
	$('height').onclick = function() {
		myHeight.toggle();
		};

	tooltip.init ();	
 }
            
window.onload = function() {
 
	//height effect
	var myHeight = new fx.Height('box');
	$('height').onclick = function() {
		myHeight.toggle();
		};
 
	tooltip.init ();	
 }
 

(als je het nu helemaal goed wil doen, wijzig je in qTip.js

php code - Bekijk de code zonder highlighting - Klap code in

                //There's No need to edit anything below this line//
tooltip = {
            
//There's No need to edit anything below this line//
tooltip = {
 

naar

php code - Bekijk de code zonder highlighting - Klap code in

                //There's No need to edit anything below this line// Yes there was..
var tooltip = {
            
//There's No need to edit anything below this line// Yes there was..
var tooltip = {
 

mathiasB - 24/08/2007 15:55 (laatste wijziging 24/08/2007 16:00)
HTML interesse		You rule! Bedankt Waar leren jullie dat allemaal, alles wat ik tot nu toe weet ken ik van experimenteren en zo... maar leer je dit alles op school (zoja oef, doe in september informatica)

bertmelis - 24/08/2007 17:19 (laatste wijziging 24/08/2007 17:19)
PHP interesse		...door problemen tegen te komen, en daarna (met hulp) op te lossen zoals jij net hebt gedaan.

Gesponsorde links

Dit onderwerp is gesloten.

Actiefste leden van de maand

Actieve forumberichten