Antworten zum Thema „jquery easing mit mootools Verträglichkeit Hilfe“

jessika0815 · 31.03.2010

Hallo zusammen,

kennt jemand eine Lösung wie man jquery easing zusammen mit mootools verwenden kann?
Ich hebe ein aufklappendes Menü mit jquery easing plugin das funktioniert und ein accordion menue mit mootools umgesetzt.
Einzeln funtionieren sie auch.
Doch zusammen in eine html eingebunden funktionieren sie nicht.
Ich habe schon die Suchfunktion und google stundenlang durchsucht.
Gefunden habe ich leider nichts das funktioniert.
Die noconflict Funktion von jquery funktioniert bei mir nicht, vermutlich weil ich nicht nur jquery sondern jquery easing verwende.
Im html Quellcode habe ich keinen weiteren javascript code.

Und der Dollar Safe Mode von Mootools funktioniert leider auch nicht.

In allen jquery noconflict beispielen die ich gefunden habe ist auch noch javascript mit im htmlquelltext. Bei mir nicht. Vielleicht geht es deshalb nicht.

Ich wäre froh wenn jemand eine Lösung dafür hätte.

Vielen Dank.

Hier mein Quelltext:

<html>
<head>

<script src="http://jqueryjs.googlecode.com/files/jquery-1.3.js" type="text/javascript"></script>
<script src="js/jquery.easing.1.3.js" type="text/javascript"></script>
<script src="animated-menu.js" type="text/javascript"></script>

<link rel="stylesheet" href="css/slideformatierung.css" type="text/css" />
<script type="text/javascript" src="mootools.js"></script>
<script type="text/javascript" src="slide.js"></script>

</head>
<body>
</body>
</html>

sokie · 31.03.2010

AW: jquery easing mit mootools Verträglichkeit Hilfe

schon gelesen?

jessika0815 · 31.03.2010

AW: jquery easing mit mootools Verträglichkeit Hilfe

Danke für die Antwort.
Das habe ich alles ausprobiert, doch leider passiert da nicht mehr.

Es bleibt dabei, dass nur eins der beiden, entweder jquery oder mootools, funtioniert.
Je nachdem welches ich zuerst aufrufe funktioniert auch. Das zweite Aufgerufene funktioniert nicht.

Ich habe es mit einem anderen jquery.easing nochmal verscht, doch damit funktioniert auch nur das zuerst Aufgerufene:

<html>
<head>

<link rel="stylesheet" href="css/slideformatierung.css" type="text/css" />
<script type="text/javascript" src="mootools.js"></script>
<script type="text/javascript" src="slide.js"></script>



<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery-easing-1.3.pack.js"></script>
<script type="text/javascript" src="js/jquery-easing-compatibility.1.2.pack.js"></script>
<script src="animated-menu.js" type="text/javascript"></script>


</head>
<body>
</body>
</html>

LowkaZ · 31.03.2010

AW: jquery easing mit mootools Verträglichkeit Hilfe

sicher das jQuery im noConflict modus läuft?

jessika0815 · 31.03.2010

AW: jquery easing mit mootools Verträglichkeit Hilfe

Jetzt gerade läuft jquery nicht im noconflict modus, sondern nur so wie ich meinen quellcode gepostet habe.
Da es bei mir nichts ausmacht habe ich es nicht drin.
Vermutlich habe ich etwas uebersehen oder vergessen.
Eingebunden habe ich es wie in dem Tutorial

Dann sieht das ganze z.B. so aus(was leider nichts bringt):

<html>
<head>

<link rel="stylesheet" href="css/slideformatierung.css" type="text/css" />
<script type="text/javascript" src="mootools.js"></script>
<script type="text/javascript" src="slide.js"></script>



<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery-easing-1.3.pack.js"></script>
<script type="text/javascript" src="js/jquery-easing-compatibility.1.2.pack.js"></script>
<script src="animated-menu.js" type="text/javascript"></script>


<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
/* <![CDATA[ */
jQuery.noConflict();
jQuery(document).ready(function($){
// Hier wird für jQuery $(...) genutzt
$("div").hide();
});
// Und auch für Prototype kann auf $(...) zurückgegriffen werden
$('eineid').hide();
/* ]]> */
</script>

</head>
<body>
</body>
</html>

Muss ich damit noconflict funktioniert und $ keine Probleme macht sonst noch irgendwie irgendwo etwas beachten? Vielleicht in der jquery.js etwas ersetzen?

Danke euch

DieWaldfeee · 31.03.2010

AW: jquery easing mit mootools Verträglichkeit Hilfe

probier mal

Code:

var $j = jQuery;

bsp.:

Code:

 $j(document).ready(function(){
       $j("div").hide();
     });

dann kannst du mootools mit " $ " verwenden

jessika0815 · 01.04.2010

AW: jquery easing mit mootools Verträglichkeit Hilfe

Danke DieWaldfeee fuer die Antwort.
Leider klappt es damit auch nicht.
Ich habe hier jetzt mal meinen gesamten html-Quelltext reinkopiert, inklusive deinem Vorschlag, vielleicht kann man dadurch das Problem sehen:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<link href="css/external.css" rel="stylesheet" type="text/css" />

<link rel="SHORTCUT ICON" href="cityLOGO.ico">


<link rel="stylesheet" href="css/slideformatierung.css" type="text/css" />
<script type="text/javascript" src="mootools.js"></script>
<script type="text/javascript" src="slide.js"></script>



<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery-easing-1.3.pack.js"></script>
<script type="text/javascript" src="js/jquery-easing-compatibility.1.2.pack.js"></script>
<script src="animated-menu.js" type="text/javascript"></script>


$j(document).ready(function(){
$j("div").hide();
});

</head>

<body>


<div id="contentdiv">
<div id="ulcenter"><ul>
<li class="green">
<p><a href="#">Startseite</a></p>
<p class="subtext">kkk</p>
</li>
<li class="yellow">
<p><a href="#">Restaurant</a></p>
<p class="subtext">Informationen zum Raustaurant</p>
</li>
<li class="red">
<p><a href="#">Hotel</a></p>
<p class="subtext">Unser Hotel</p>
</li>
<li class="blue">
<p><a href="#">Gästebuch</a></p>
<p class="subtext">Verewigen Sie sich</p>
</li>
<li class="purple">
<p><a href="#">Anfahrt</a></p>
<p class="subtext">So finden Sie uns</p>
</li>
</ul></div>
<div id="contentnavi">



<div id="accordion">
<h3 class="toggler"><table border="0" cellpadding="3px"><tr><td valign="top"><img src="images/zahl1.jpg" alt="Restaurant" /></td><td valign="middle">Restaurant</td></tr></table></h3>
<div class="element">
<h4>Common ancestor</h4>
<p>The first suggestion that all organisms may have had a common ancestor and diverged through random variation and natural selection was made in 1745 by the French mathematician and scientist Pierre-Louis Moreau de Maupertuis (1698-1759) in his work Venus physique. Specifically:</p>
</div>

<h3 class="toggler"><table border="0" cellpadding="3px"><tr><td valign="top"><img src="images/zahl2.jpg" alt="Bildergalerie" /></td><td valign="middle">Bildergalerie</td></tr></table></h3>
<div class="element">
<h4>Common biochemistry and genetic code</h4>
<p>All known forms of life are based on the same fundamental biochemical organization: genetic information encoded
<img src="images/phylogenetic_tree.png" width="100" height="100" align="right" alt="" />in DNA, transcribed into RNA, Analysis of the small differences in the genetic code has also provided support for universal common descent.[2]</p>
</div>

<h3 class="toggler"><table border="0" cellpadding="3px"><tr><td valign="top"><img src="images/zahl3.jpg" alt="Speisekarte" /></td><td valign="middle">Speisekarte</td></tr></table></h3>
<div class="element">
<h4>Artificial selection</h4>
<p>Artificial selection offers remarkable examples of the amount of diversity that can exist between individuals sharing a late common ancestor. To perform artificial selection, one begins with a particular species (following examples include wolves and wild cabbage) and then, at every generation, only allow certain individuals to reproduce, based on the degree to which they exhibit certain desirable characteristics. In time, it is expected that these characteristics become increasingly well-developed in successive generations. Many examples of artificial selection, like the ones below, occurred without the guidance of modern scientific insight.</p></div>
</div>

</div>
</div>
</body>

</html>

DieWaldfeee · 01.04.2010

AW: jquery easing mit mootools Verträglichkeit Hilfe

hi again!

HTML:

<head>
   ...
<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function($){
  // in dem container steht $ für jquery
     ...
});

// ab hier $ für mootools
    ...

</script>
</head>

muss funktionieren! lg.

jessika0815 · 04.04.2010

AW: jquery easing mit mootools Verträglichkeit Hilfe

Dankeschoen DieWaldfeee!
Jetzt funktioniert es

Eine Sache musste ich noch anpassen.
An die Stelle "// in dem container steht $ für jquery" von deinem Code musste ich den gesamten externen Javascript code von animated-menu.js nehmen und an diese Stelle kopieren.
Ganauso mit dem slide.js code der an deine "// ab hier $ für mootools"-Stelle kopiert werden musste.

Danke nochmal, echt nett von dir

egal100 · 03.05.2010

AW: jquery easing mit mootools Verträglichkeit Hilfe

jessika0815 schrieb:
Dankeschoen DieWaldfeee!
Jetzt funktioniert es

Eine Sache musste ich noch anpassen.
An die Stelle "// in dem container steht $ für jquery" von deinem Code musste ich den gesamten externen Javascript code von animated-menu.js nehmen und an diese Stelle kopieren.
Ganauso mit dem slide.js code der an deine "// ab hier $ für mootools"-Stelle kopiert werden musste.

Danke nochmal, echt nett von dir

Hi,

ich habe in etwa das selbe Problem. Ich versuche fx.slide (Mootools) und Fancybox (jQuery) zum Laufen zu bringen. Ich verstehe deinen letzten Schritt nicht, könntest du ihn mir etwas genauer erklären bitte?

Danke!

DieWaldfeee · 05.05.2010

AW: jquery easing mit mootools Verträglichkeit Hilfe

egal100 schrieb:
Hi,

ich habe in etwa das selbe Problem. Ich versuche fx.slide (Mootools) und Fancybox (jQuery) zum Laufen zu bringen. Ich verstehe deinen letzten Schritt nicht, könntest du ihn mir etwas genauer erklären bitte?

Danke!

HTML:

<head>
   ...
<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function($){
 // hier (in diesem container) steht $ für jQuery
    ...

});

// ab hier $ für mootools 
    ...

</script>
</head>

deinen fancybox code snip kopierst du in die funktion

HTML:

jQuery(document).ready(function($){

//hier dein fancybox.js

});

und alles was hinter }); steht, zb. deine funktion für mootools fx.slide wird $ für diese benutzt und nicht für jQuery.