如何使用div實現光標功能與谷歌

我在我的項目中使用鉻瀏覽器和我的網址的文本字段，它不顯示閃爍的光標。我試圖加載google.com，它的工作。我想通過谷歌使用div的形式自己的光標。但無法複製他們的解決方案。如果任何人都可以提供幫助，那就太棒了。如何使用div實現光標功能與谷歌

謝謝。

<div style="background-image: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: rgb(0, 0, 0); padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; position: absolute; top: 1px; z-index: 4; white-space: pre; width: 1px; height: 20px; background-color: rgb(0, 0, 0); left: 3px; display: none; background-position: initial initial; background-repeat: initial initial; "></div>

來源

2012-02-09 Raj

你在說「contenteditable」嗎？如果你可以發佈谷歌的代碼，這將是有益的。我不確定你在說什麼。 http://jsfiddle.net/Lp2d3/ – mrtsherman 2012-02-09 05:45:06

如果你在mozilla中加載google.com並使用螢火蟲附加組件，你會發現谷歌使用尺寸div：1px（width）20px（height）作爲閃爍光標。 – Raj 2012-02-09 05:57:24

我看不到這樣的事情。經過測試的chrome，ff7和ff10。他們使用輸入字段。 – mrtsherman 2012-02-09 06:22:50

鉻更新小提琴：http://jsfiddle.net/techfoobar/xEVSu/2/

選中此FID dle：http://jsfiddle.net/techfoobar/xEVSu/

我所做的是爲遊標執行自定義閃爍DIV，其行爲與普通遊標類似 - 即隨文本輸入，選擇更改等一起移動。還實現了自定義高亮DIV（用於文本選擇）。實施它很有趣，我必須說！ :)

注意：除非你有一個很好的理由是想自定義實現，使用所提供的文本框功能的默認瀏覽器。

來源

2012-02-09 08:54:21 techfoobar

需要在輸入區模糊上淡出，但爲您的工作+1。 – Christoph 2012-02-09 09:01:50

此外：刪除不能正常工作;） – Christoph 2012-02-09 09:03:00

是的，對它做的測試很少。很可能會有一些缺陷.. :)但我希望它在正確的方向上領先OP .. – techfoobar 2012-02-09 09:14:27

-1

那麼，即使我看不到你在說什麼，我也會這樣做。

http://jsfiddle.net/pP3zk/

CSS

div { 
    height: 20px; 
    width: 1px; 
    border-left: 1px solid black; 
}

jQuery的

function blink() { 
    $('div').fadeOut(function() { 
     $(this).fadeIn(blink); 
    }); 
} 

blink();

來源

2012-02-09 06:28:12 mrtsherman

讓DIV眨眼是很容易的部分。困難的部分是根據實際的光標移動精確定位它。 – techfoobar 2012-02-09 07:13:37

如何使用div實現光標功能與谷歌

回答

相關問題