2014-03-18 77 views
0

在點擊鏈接到jQuery時無法顯示內容。所有的CSS和代碼都在那裏。我只是想讓它只需點擊「Antonio Nogueras」就能彈出。 CSS在最底層。讓我知道我能做些什麼。嘗試在點擊jQuery時顯示div內容

<!DOCTYPE html> 
<html> 
<head> 
<link href='http://fonts.googleapis.com/css?family=Scada' rel='stylesheet' type='text/css'> 

<link href='stylesheet.css' rel='stylesheet' type='text/css'> 
<title>Glotacosm - Digital Production - SEO/PPC/SOCIAL/COPYWRITING/DESIGN/WEBDESIGN</title> 
</head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"> 
</script> 
<script type="text/javascript"> 
    document.ready(function() 
    { 
     $('div#about').click(function() { 
     $('div#aboutcontent').show(); 
    }); 
    }); 
    </script> 
<body> 

<h1>GLOTACOSM -SEO/PPC/SOCIAL/COPYWRITING/DESIGN/WEBDESIGN </h1> 


<div class="wrapper"> 
    <div id="MainMenu"> 
    <div id="about"> 
     <a class="change" target="_blank" >ANTONIO NOGUERAS</a></br> 
    </div> 
     <a class="change" target="_blank" id="digitalmarketing" >DIGITAL MARKETING</br> 
     <a class="change" target="_blank" >SOCIAL MEDIA MGMT</br> 
     <a class="change" target="_blank">FORMS + FUNCTIONS</br> 
     <a class="change" target="_blank">A WAY WITH WORDS</br> 
     <a class="change" target="_blank">WEB DEVELOPMENT</br> 
     <a class="change" target="_blank">GENERAL MUSINGS</br> 
    </div> 
<div class="aboutcontent"> 
    <div class="profilepic"> 
     <img src="http://square205.com/images/the-team/Antonio-photo1.jpg"></img> 
     <p> 
     Name: Antonio Nogueras</br> 
     Age: 24</br> 
     Stomping grounds: Denton, TX</br> 
     Height: Astronomical</p> 
    </div> 
    <div class="about"> 
     <p id="p1about"> 
       <p>To indtroduce myself, my name is Antonio Nogueras and I'm somewhat of a digital ventrlioquist - I make the pixels do the talking for me. I do a lot; you may have noticed. Let me be upfront so as to be clear: all of who I am does not come without the profficiency and efficiency of ideas. It is my honor to weild a world of language, code and color to bring digital clairvoyance to the electro-landscape of the 21st century.I have been writing almost all my life, and typos, like nagging gremlins, claw at my integrity each day, but what doesn't kill you surely makes you stronger. I have also been in tune with the underpinnings of the digital marketing landscape for some time now, </ br>  
       </br> 
       </br> 
       Now, where were we? Oh, that's right - I'd like to work for you, or you simply just peruse my expertise. Let's talk business or shop, or maybe we can talk about how to implementing a how to fine-tune your web shop for a more fluid buying cycle. Whatever you need, you can talk to me here (I promise I'm not as ecentric as this block of text lets on.).</br> 
       </br> 
       Contact: <strong>[email protected]</strong> 
       </p> 
     </div> 
</div> 
</div> 
</body> 
</html> 

.about 
{ 
position: absolute; 
margin-left: 400px; 
margin-top:100px; 
display: block; 
font-family: 'Scada', sans-serif; 
font-size: 18px; 
width: 425px; 
} 

.aboutcontent { 
display: none; 

} 

回答

2

它應該是這樣的

$(document).ready(function() { 
    $('#about a').on('click', function(e) { 
     e.preventDefault(); 
     $('.aboutcontent').show(); 
    }); 
}); 

,請注意你的HTML是真的無效,缺少一個右元素幾乎無處不在。

+0

這絕對是這個工作。看來還有很多東西需要學習。謝謝! –