Yotube like comment-當用戶嘗試添加評論時顯示在textarea上的鏈接

Question

我正在處理asp.net application.And我正在尋找一種方式來顯示在textarea上的鏈接，當用戶嘗試添加如果用戶沒有登錄，則發表評論。

我從Youtube視頻評論中獲得了這個想法。如果你沒有被連接，他們會顯示一條鏈接，說你必須登錄才能添加評論。

有沒有人有一個想法如何做到這一點jQuery代碼將是有益的。

在此先感謝。

最好的問候， 拉希德

Answer 1

你可以做到這一點與您放置在文本區域上mouseenter覆蓋鏈接。然後，它也只是對mouseleave隱藏它的問題：

HTML

<div id="comment"> 
    <textarea rows="3" cols="20"></textarea> 
    <a class="overlay" href="" style="display: none; position: absolute;">You must login</a> 
</div> 

jQuery的

$('#comment').mouseenter(function() { 
    var textarea = $(this).find('textarea'); 
    var overlay = $(this).find('.overlay'); 

    var pos = textarea.position(); 
    overlay.css({ 
     top: pos.top, 
     left: pos.left, 
     width: textarea.width(), 
     height: textarea.height(), 
     display: 'block' 
    }); 
}); 

$('#comment').mouseleave(function() { 
    var overlay = $(this).find('.overlay'); 
    overlay.css({ 
     display: 'none' 
    }); 
}); 

你可以看到它in action here。