Dołącz do zespołu ekspertów! Backend lub Frontend Developer?

Sprawdź najnowsze oferty pracy naszego partnera - 8lines.io!

prototype.js a jQuery Konflikt.

Założony przez  Czeladnik.

02.04.2011, 12:54 (Ten post był ostatnio modyfikowany: 02.04.2011, 12:56 przez Czeladnik.)
#1
Witajcie,

mam mały problem co do JS, zrobiłem takie coś:
    <link rel="stylesheet" href="/style.css" type="text/css" charset="utf-8" />
        <script type="text/javascript" src="/js/prototype.js"></script>
        <script type="text/javascript" src="/js/script.js"></script>
  <script>
i
<script type="text/javascript">
$(function(){ $('#d a')    .css( {backgroundPosition: "0 0"} )    .mouseover(function(){ $(this).stop().animate({backgroundPosition:"(0 -250px)"}, {duration:500}) }) .mouseout(function(){ $(this).stop().animate({backgroundPosition:"(0 0)"}, {duration:500}) }) });
</script>
<div id="menu-left">
    <ul id="d">
        <li><a href="/"> Strona Główna </a></li>
        <li><a href="#"> Panowie </a></li>
        <li><a href="#"> Forum </a></li>
        <li><a href="#"> Kontakt </a></li>
    </ul>
</div>
<div class="miniatury">
<a rel="lightbox[roadtrip]" id="dawid-fotki" class="foto1" href="/img.php?mini=./galeria/dawid1nago.jpg" title="Dawid"><img src="/galeria/dawid1nago_mini.png" alt="Miniaturka Dawid 2" /></a>
<a rel="lightbox[roadtrip]" id="dawid-fotki" class="foto1" href="/img.php?mini=./galeria/dawid2nago.jpg" title="Dawid"><img src="/galeria/dawid2nago_mini.png" alt="Miniaturka Dawid 2" /></a>
<a rel="lightbox[roadtrip]" id="dawid-fotki" class="foto1" href="/img.php?mini=./galeria/dawid3nago.jpg" title="Dawid"><img src="/galeria/dawid3nago_mini.png" alt="Miniaturka Dawid 2" /></a>
<a rel="lightbox[roadtrip]" id="dawid-fotki" class="foto1" href="/img.php?mini=./galeria/dawid4nago.jpg" title="Dawid"><img src="/galeria/dawid4nago_mini.png" alt="Miniaturka Dawid 2" /></a>
</div>

I nie działa, albo menu, albo light box... Teraz pytanie. Jak się pozbyć konflitku? Próbowałem:
<script>
     jQuery.noConflict();
    
     $('#dawid-fotki a').hide();
    
     // Use jQuery via jQuery(...)
     jQuery(document).ready(function(){
       jQuery('#d a').hide();
     });


     // Use Prototype with $(...), etc.

   </script>
Ale nie działa, albo nie wiem jak tego użyć.


PS: /js/script.js to wersja minimal jquery
02.04.2011, 14:56
#2
Gdzie go wklejałeś ?
02.04.2011, 16:01 (Ten post był ostatnio modyfikowany: 02.04.2011, 17:17 przez Czeladnik.)
#3
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">



<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>



    <title>asdm...</title>

    <link rel="stylesheet" href="/style.css" type="text/css" charset="utf-8" />

        <script type="text/javascript" src="/js/prototype.js"></script>

        <script type="text/javascript" src="/js/script.js"></script>

  <script>

     jQuery.noConflict();

    

     $('#dawid-fotki a').hide();

    

     // Use jQuery via jQuery(...)

     jQuery(document).ready(function(){

       jQuery('#d a').hide();

     });





     // Use Prototype with $(...), etc.



   </script>





    <script type="text/javascript" src="/js/scriptaculous.js?load=effects,builder"></script>



    <script type="text/javascript" src="/js/lightbox.js"></script>

    <link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />



<script type="text/javascript">

$(function(){ $('#d a')    .css( {backgroundPosition: "0 0"} )    .mouseover(function(){ $(this).stop().animate({backgroundPosition:"(0 -250px)"}, {duration:500}) }) .mouseout(function(){ $(this).stop().animate({backgroundPosition:"(0 0)"}, {duration:500}) }) });

</script>

</head>



<body>

<div id="logo"></div>

<a id="dawida" href="/?p=dawid" ></a>

<a id="krzysiek" href="/?p=krzysiek" ></a>

<a id="kuba" href="/?p=kuba" ></a>

<a id="michal" href="/?p=michal" ></a>



<div id="menu-left">

    <ul id="d">

        <li><a href="/"> Strona Główna </a></li>

        <li><a href="#"> Panowie </a></li>

        <li><a href="#"> Forum </a></li>

        <li><a href="#"> Kontakt </a></li>

    </ul>

</div>

<img id="tyl" src="/galeria/dawid_head.png" alt="Dawid" width="600"/>



<div class="miniatury">

<a rel="lightbox[roadtrip]" id="dawid-fotki" class="foto1" href="/img.php?mini=./galeria/dawid1.jpg" title="Dawid"><img src="/galeria/dawid1nago_mini.png" alt="Miniaturka Dawid 2" /></a>

</div>







<div id="informacja">

e-mail: kontakt@xx.com  ZADZWOŃ!!!

</div>

</body>
Cała strona...
Już nie ważne, można kosz..
Axboard napisał 29.04.2011, 13:27:
Jak szybko otrzymać pomoc na forum? Nie usuwamy tematów:D
02.04.2011, 17:19
#4
Jak dasz noconflit to po prostu w kazdej funkcji jquery zamieniasz $ na jQuery
Serwery CS REKSIO:))



Użytkownicy przeglądający ten wątek:

1 gości