How to disappear in the content when you hover over the link?

Question

I am trying to make content disappear or appear on my blog when the mouse freezes over the link. For example, on my blog http://www.ricardopomalaza.com/ , if someone hovered over one of the links on the pages, for example, "Home" or "About", I would like the content to be displayed below them, not clicking on them to get there. Is it possible? I am a little new in web design. Your help will be appreciated, thanks. - Rick

Answer 1

what about something like:

$(document).ready(function()
{
    $(".navigation a").hover(function()
    {
        var href=$(this).attr("href");
        $("#content").fadeOut("fast", function()
        {
            $("#content").empty();
            $("#content").load(href+" #content", function()
            {
                $("#content").fadeIn("fast");
            });
        });            
    },
    function(){});    
});

Of course, with this you will need to have jquery.

this will cause the content area to disappear, load new content, and then disappear.

Answer 2

( , ), , , :

$('a').hover(
    function(){
        var href = this.href;
        $('#divToShowStuffIn').load(href + ' #divToLoadFrom');
    },
    function() {
        $('#divToShowStuffIn').empty();
    });

, , jQuery .

:

• hover(),
• load(),
• empty().

Answer 3

1 - style="display:none" .

2 - jQuery HEAD. - : <script type="text/javascript" language="javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.3.2.min.js"></script>

3 - :

$(document).ready(function() { init() })

function init() {
    $("#myDiv").hover(
      function () {
        $("#targetDIV").stop();
        $("#targetDIV").fadeIn('slow');
      }, 
      function () {
        $("#targetDIV").stop();
        $("#targetDIV").fadeOut('slow');
      }
    );
}

Answer 4

javascript AJAX. jQuery. http://www.west-wind.com/presentations/jquery/ hover:

$("a").hover(function() {

});

AJAX .

     $("a").hover(function() {
     var href=$(this).attr("href");
     $.ajax({
   type: "POST",
   url: href,
   success: function(msg){
     $("body").html(msg);
   }
 });


     });