jquery hover on dialog

<div id="view"></div>
<div class="bar" style="padding:0px;" id="bar">
    <script>
       var bar = '<img class="myclass" src="button.png" >&nbsp&nbsp' ;
       $view = jQuery('#view') ;
       $view.dialog({ 
          height: 650, 
          width: 650, 
          buttons: { "welcome" :        
             function() { msg() ; } 
          },
          open: function(event, ui) 
           { if (full_toggle == 1) 
             {             
                $bar.dialog('open') ;
             } 
            }
          }) ;
        bar = $(".bar", "#view").dialog({ 
   开发者_如何学C              height: 30, 
                 width: '100%',
                 textAlign : "justify",  
                 marginLeft : "auto",
                 marginRight:"auto"
         })
    </script>
</div>

In the above script since bar is a dialog how can i do a hover or mouseover property on bar

How about this:

 $('.myclass').mouseover(function(){
   // whatever....
 });

Or

 $('.myclass').hover(function(){
   // whatever....
 });

You don't need to mix javascript code with HTML. you can put it on the HEAD section inside $(function(){}); like the bellow code.

$(function(){
     $('.bar').hover(
        function(){ alert('Hover!'); },
        function(){ alert('Hover Out!'); }
     );
});

jQuery UI dialog render some html. I suggest you hook in into the html that you want to hover.

For example:

$('.ui-dialog').live('hover', function(){ alert('Hover!'); } );

You can also use:

$view.dialog({
       open: function(){ 
            $('.ui-dialog').hover( function(){ alert('Hover!'); } });
       }
});

Look here for additional resource.

 $('#bar').hover(function(){ 
        alert('I was hovered...'); 
        //function code here...
    },
    function(){ 
        alert('No longer hovered...'); 
        //function code here...
    }
 });

I would also recommend modifying your code a bit... Its cleaner to read if you put all of the HTML elements in there such as your image and then at the bottom of the page, place your document ready jQuery code that initializes all of the other items like dialogues, etc. Placing JavaScript at the bottom of your page will improve load times.