[jQuery] jQuery en Prototype.js gebruiken op 1 pagina

[SpaceK33z]

Voor mijn nieuwe portfolio maak ik gebruik van een scriptje dat is gemaakt met jQuery (LavaLamp) en maak ik gebruik van LightWindow, wat gebruik maakt van Prototype.js en Scriptaculous.

Nou is het probleem dat die 2 scriptjes niet samenwerken. Ik heb al gekeken door steeds 1 bestand weg te halen waar het probleem in zit. Het probleem zit in het prototype.js.

Ik had al gegooglet en daardoor kwam ik op de functie jQuery.noConflict();. Echter wil deze functie niet bij mij werken .

Hier zie je het effect in het menu werkend:
http://www.keeskluskens.nl/portfolio/
En hier LightWindow:
http://www.keeskluskens.nl/portfolio2/index.php?p=portfolio
Deze 2 krijg ik dus niet samen aan de praat. Weet iemand hoe/waar ik jQuery.noConflict(); moet gebruiken?

[Caelorum]

misschien dat dit helpt:

Use the following technique, which allows you to use $ inside of a block of code without permanently overwriting $:
(function($) { /* some code that uses $ */ })(jQuery)
Note: If you use this technique, you will not be able to use Prototype methods inside this capsuled function that expect $ to be Prototype's $, so you're making a choice to use only jQuery in that block.

[ Voor 228% gewijzigd door Caelorum op 21-10-2009 09:20 ]

[Bosmonster]

Als jij

JavaScript:

<script type="text/javascript"> 
    $(function() { $("#topmenu").lavaLamp({ fx: "backout", speed: 700 })});
</script> 

vervangt met

JavaScript:

<script type="text/javascript"> 
    jQuery.noConflict();
    jQuery(function() { jQuery("#topmenu").lavaLamp({ fx: "backout", speed: 700 })});
</script> 

Zou dat gewoon moeten werken, als de plugin goed opgebouwd is. (en dat istie voor zover ik kan zien)

Hou er dus wel rekening mee dat je $ niet meer kunt gebruiken voor jQuery, aangezien die hem weer teruggeeft aan prototype (die anders over de rooie gaat).

Beter kun je overigens prototype en scriptaculous links laten liggen en dezelfde functionaliteit in een jQuery plugin zoeken. Scheelt je bakken met code en vervuiling van je namespace.

Caelorum schreef op woensdag 21 oktober 2009 @ 09:08:
misschien dat dit helpt:
[...]

Dit is een vervolgoplossing om toch de $ te kunnen gebruiken na het toepassen van noConflict, maar is geen oplossing an sich.

[ Voor 42% gewijzigd door Bosmonster op 21-10-2009 10:17 ]

[crisp]

Beter kun je overigens prototype en scriptaculous links laten liggen en dezelfde functionaliteit in een jQuery plugin zoeken.

Of andersom natuurlijk...

Het is sowieso niet aan te raden verschillende libraries door elkaar te gebruiken, niet in de laatste plaats vanwege het feit dat de client dan 2 - meestal al niet zulke kleine - JS-bestanden moet laden. Maar in de eerste plaats natuurlijk omdat een library nu eenmaal een bepaalde manier van werken/programmeren met zich meebrengt en het puur vanuit consistentie en daarmee onderhoudbaarheid aan te raden is je te confirmeren aan één methodiek.

[ Voor 58% gewijzigd door crisp op 21-10-2009 13:06 ]

[SpaceK33z]

@BosMonster: Helaas, dat helpt niet. Ik had niet zo veel tijd vanochtend toen ik het topic maakte en daarom staat niet alles wat ik geprobeerd er bij. Ik heb de functies enz. allemaal proberen aan te passen, maar dat werkte helaas allemaal niet.
Ik heb al een oplossing gevonden: Ik zoek een andere lightbox variant voor jQuery . Kan iemand me er een aanraden die ook websites kan laten zien? Ik ben nou aan het kijken naar http://catcubed.com/2008/...-thickboxvideobox-mashup/ en http://colorpowered.com/colorbox/core/example1/index.html

[Bosmonster]

Wij gebruiken hier altijd Shadowbox. Die kan eigenlijk alles wel laten zien. En werkt bovendien voor alle libraries (en ook zonder).

[Ram0n]

Zeker, Shadowbox werkt prima met de diverse scripts samen, je kan gewoon kiezen welke library je wilt gebruiken als basis. Bovendien kan die heel veel formaten laten zien, onder andere ook gewoon webpagina's.

[SpaceK33z]

Oke, bedankt. Ik zag dat je wel voor ShadowBox moest betalen als je het commercieel wilt gebruiken. Ik heb daarom toch voor ColorBox gekozen. Ik kan het jullie allemaal aanraden:
http://colorpowered.com/colorbox/
Het is makkelijk te integreren en is heel makkelijk aan te passen aan een eigen stijl.

[ Voor 3% gewijzigd door SpaceK33z op 21-10-2009 19:55 ]