JQuery Tooltip...non riesco a farlo funzionare

**lucaeffe** · 16-11-2009, 16:46

http://www.antoniofullone.it/tutoria...ip-con-jquery/

Da qui ho scaricato il tooltip e l'ho provato in due modi.

Il primo nella mia pagina (posto l'intero head)

HTML

codice:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="PORTFOLIO.css" rel="stylesheet" type="text/css" />
            
<title>Lucaeffe.it</title>



 

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



    <script type="text/javascript"  src="JS/jquery-lightbox-0.5/js/jquery.js"></script>
<script type="text/javascript" src="JS/jquery-lightbox-0.5/js/jquery.lightbox-0.5.js"></script>
   
   
    <link rel="stylesheet" type="text/css" href="JS/jquery-lightbox-0.5/css/jquery.lightbox-0.5.css" media="screen" />
    <script type="text/javascript">
    $(function() {
        $('#gallery a').lightBox();
    });
    </script>
   
  

 <script type="text/javascript" src="JS/jquery-lightbox-0.5/jquery.color.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $('#menu a').hover(function() {
        $(this).animate({
              color: '#fc0'
          }, 100);   
                      },
              function() {
                  if (!$(this).hasClass("sel")) {
                      $(this).animate({
                          color: "#fff"
                      }, 2000);
                  }

    });
});


</script> 
  
<script type="text/javascript" src="JS/jquery-tooltip/jquery.tooltip.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
    $("#tool a").tooltip({
    track: true,
    delay: 0,
    fixPNG: true,
    top: 15,
    showURL: false,
    left: 5    ,
    });

    });
</script>
   

    <script type="text/javascript" src="JS/easySlider/easySlider/js/easySlider.js"></script>
     <script type="text/javascript">
    $(document).ready(function(){
   
    $("#slider").easySlider({
        prevText:'<',
        prevId: 'prevBtn',
        nextText: '>',
        nextId: 'nextBtn',
        orientation: 'horizontal'

       
                       
                           
    });
   
   $("#slider2").easySlider({
       prevText: '<',
       prevId: 'prevBtn2',
       nextText: '>',
       nextId: 'nextBtn2',

    });
  
      
   $("#slider3").easySlider({
       prevText: '<',
       prevId: 'prevBtn3',
       nextText: '>',
       nextId: 'nextBtn3',

    });
   
});

    </script>

   
   
   
   
   
   




    <style type="text/css">
    /* jQuery lightBox plugin - Gallery style */
    #gallery{
        margin:0;
        width:100%;
        height:3500px;
        text-decoration:none
    }
   
    #gallery a{
        font-family:Arial, Helvetica, sans-serif;
        color:#FFF;
        text-decoration:none;
        }
       
    #gallery ul {
        list-style: none;
        padding:100px 0 0 50px;
        margin:0 0 50px 0
    }
    #gallery ul li {
        display: inline;
    }
    #gallery ul img {
        margin:0 auto;
        border: 5px solid #3e3e3e;
        border-width:0;
    }
    #gallery ul a:hover img {
        border: 1px solid none;
        border-width:0;
        color: #fff;
    }
    #gallery ul a:hover { color: #fff;
    }
   
    </style>
   

            


</head>

CSS

codice:

#tool{
position:relative;
width:500px;
height:100px;
margin:0;
border:1px solid #ccc;
padding:0;
background:#f5f5f5;
}

Il link per lo sxript non funziona e allora ho deciso di provare in una nuova pagina

HTML

codice:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="Untitled-2.css" rel="stylesheet" type="text/css" />
<title>Untitled Document</title>

<script type="text/javascript" src="JS/jquery-tooltip/lib/jquery.js"></script>
<script type="text/javascript" src="JS/jquery-tooltip/jquery.tooltip.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
    $('#tool a').tooltip({
    track: true,
    delay: 0,
    fixPNG: true,
    top: 15,
    showURL: false,
    left: 5    ,
    });

    });
   
    </script>

CSS

codice:

@charset "utf-8";
/* CSS Document */

body{
    background:#063;
}
#tool{
position:relative;
width:500px;
height:100px;
margin:auto;
border:1px solid #ccc;
padding:10px;
background:#f5f5f5;
}
#tool a{
font-size:1.4em;
}

Ma il risultato è identico,ovvero lo script non ne vuol sapere di funzionare!!

**tapu** · 16-11-2009, 17:22

ciao , non sono un esperto in jquery, mi sto cimentando ora ...

ho letto velocemente il codice, sei sicuro che vada dichiarata cosi questa linea?
$('#gallery a').lightBox();
proverei, se non ne sei sicuro in questa maniera

$('a#gallery').lightBox();

normalmente la dichiarazione è $("tag[#id o .class]").metodo

ci sono un sacco di tutorial per i tips...

ciao

**m4rko80** · 16-11-2009, 17:33

ciao,. mi intrometto scusate.. ma $('#gallery a').lightBox(); va bene comunque.

Scritto così va a predere tutti i tag<A> all interno del tag di id gallery

**lucaeffe** · 16-11-2009, 22:24

Il resto degli script funziona alla perfezione,l'unico è tooltip..

Discussione: JQuery Tooltip...non riesco a farlo funzionare

Strumenti discussione

Ricerca discussione

Visualizza

JQuery Tooltip...non riesco a farlo funzionare

Permessi di invio