私はGoogleホームページの動作を変更するためにブックマークレットを作成しています。私は視覚的な検索ページのプレビュー機能が大好きです。最高だ。 BUT私は実際にそれを見るためにリンクをマウスオーバーする必要があるのとは対照的に、LIVE SEARCHとして機能していたらどうなるかを見たいと思っています。Javascriptを使用してDOMに追加するリンクがクリックできないのはなぜですか?
これにはいくつかのステップがあります - 私は部分的な機能が動作しています。
ここにJSコードがあります。
javascript: (function() {
c = document.getElementById('ires');
nli = document.createElement('div');
cell = 0;
for (var Obj in google.vs.ha) {
na = document.createElement('a');
na.href = Obj;
na.style.cssFloat = 'left';
na.style.styleFloat = 'left';
nd = document.createElement('div');
cldiv = document.createElement('div');
cldiv.style.clear = 'both';
nd.style.width = google.vs.ha[Obj].data.dim[0] + 'px';
nd.style.height = google.vs.ha[Obj].data.dim[1] + 'px';
nd.style.margin = '5px';
nd.style.padding = '5px';
nd.style.border = '1px solid #999999';
if (google.vs.ha[Obj].data.tbts.length) {
nilDiv = document.createElement('div');
for (i = 0; i < google.vs.ha[Obj].data.tbts.length; i++) {
box = google.vs.ha[Obj].data.tbts[i].box;
newbox = document.createElement('div');
newbox.className = 'vsb vsbb';
newbox.style.position = 'relative';
newbox.style.top = (box.t) + 'px';
newbox.style.left = box.l + 'px';
newbox.style.height = box.h + 'px';
newbox.style.width = box.w + 'px';
nilDiv.appendChild(newbox);
newtext = document.createElement('div');
newtext.className = 'vsb vstb';
newtext.innerHTML = google.vs.ha[Obj].data.tbts[i].txt;
newtext.style.top = (box.t) + 'px';
newtext.style.position = 'relative';
nilDiv.appendChild(newtext);
}
nilDiv.style.height = '0px';
nd.appendChild(nilDiv);
}
for (i = 0; i < google.vs.ha[Obj].data.ssegs.length; i++) {
ni = document.createElement('img');
ni.src += google.vs.ha[Obj].data.ssegs[i];
ni.className += ' vsi';
nd.appendChild(ni);
}
na.appendChild(nd);
nli.appendChild(na);
};
c.insertBefore(nli, c.firstChild);
})();
それは現時点で動作する方法は、Googleの
- 置かれる虫眼鏡
- をクリックしてブックマークをクリックし
現在のところ、何らかの理由で - リンクが追加されるイメージプレビューにテキストボックスがないかぎり、ページはクリックできません。 DOMの理解が進む限り、<a>
タグのコンテンツ全体をクリック可能にする必要があります。
誰でも問題が分かっていますか?
他の質問は、ユーザーがクリックすることなく画像を自動照会する方法です。
これが完了したら、すべてをイベントリスナーに変えて、検索ウィンドウにキーアップで画像を自動照会して表示します。
どのようにクールになりますか? :)
ブックマークレットをスタック上で「コンパイル」することはできませんが、ここでツールバーにドラッグできるのは、http://chesser.ca/2010/11/google-visual-image-search-hack-markletです。
またはHREFこの
<a href="javascript:(function(){c=document.getElementById('ires');nli=document.createElement('div');cell=0;for(var Obj in google.vs.ha){na=document.createElement('a');na.href=Obj;na.style.cssFloat='left';na.style.styleFloat='left';nd=document.createElement('div');cldiv=document.createElement('div');cldiv.style.clear='both';nd.style.width=google.vs.ha[Obj].data.dim[0]+'px';nd.style.height=google.vs.ha[Obj].data.dim[1]+'px';nd.style.margin='5px';nd.style.padding='5px';nd.style.border='1px solid #999999';if(google.vs.ha[Obj].data.tbts.length){nilDiv=document.createElement('div');for(i=0;i<google.vs.ha[Obj].data.tbts.length;i++){box=google.vs.ha[Obj].data.tbts[i].box;newbox=document.createElement('div');newbox.className='vsb vsbb';newbox.style.position='relative';newbox.style.top=(box.t)+'px';newbox.style.left=box.l+'px';newbox.style.height=box.h+'px';newbox.style.width=box.w+'px';nilDiv.appendChild(newbox);newtext=document.createElement('div');newtext.className='vsb vstb';newtext.innerHTML=google.vs.ha[Obj].data.tbts[i].txt;newtext.style.top=(box.t)+'px';newtext.style.position='relative';nilDiv.appendChild(newtext);}nilDiv.style.height='0px';nd.appendChild(nilDiv);}for(i=0;i<google.vs.ha[Obj].data.ssegs.length;i++){ni=document.createElement('img');ni.src+=google.vs.ha[Obj].data.ssegs[i];ni.className+=' vsi';nd.appendChild(ni);}na.appendChild(nd);nli.appendChild(na);};c.insertBefore(nli,c.firstChild);})();">bookmarklet</a>
私は今それを試してみましょう!本当にありがとう。 –
奇妙なことに、イメージをA要素内の唯一のものに移動すると、イメージはクリック可能ですが、styleFloatを含むDIVに適用しない場合に限ります。 –