-1

jquery .load() を使用してテキストをロードし、テキストを変更して画像の前に情報テキストとして表示する方法を知りたいと思っていました。

実装できる方向はありますか？私は本当にjqueryが初めてです。

ありがとう

編集：

申し訳ありませんが、私が試したのは次のとおりです。

    $().load("image1.jpg.txt");

しかし、それをクラス要素または変数に格納して表示できるようにする方法についての考えに固執しています。私はhtmlを使用して画像をインポートし、cssを使用して変更および移動することに精通していますが、jqueryからロードして画像に配置するよりも逆の方法で混乱しています。

4

2 に答える 2

1

ドキュメントの例を見てください

$( "#result" ).load( "ajax/test.html", function() {
  alert( "Load was performed." );
});

イメージ上のコンテナに配置するだけです

<div class='image-box'>
  <img src='...'/>
  <span id='img-description'></span>
</div>

JSで

 $( "#result" ).load( "ajax/test.html", function(data) {
      $('#img-description').html(data);
      //or you can change data before puting to span
    });

imgにスパンを重ねるためのccsを書いていただけませんか？

于 2013-10-18T01:32:43.490 に答える
1

私があなたを正しく理解していると仮定すると、CSS ポジショニング要素を使用して、元のテキストを含む a を、CSS ポジショニング要素を介して画像を含む別の div の下に配置できます 。

たとえば、CSS を使用して配置された、次のような 2 つの div があるとします。

<div id="myText"></div>
<div id="myImage"></div>

その後、jQuery で次のようなことができます。

$(document).ready(function() {
    var $myText = $("#myText");
    $myText.text("Hello!");
    $myText.css("z-index", "2");
    $("#myImage").css("z-index", "1");
}

この場合、ページの読み込み時に設定されます。

または、ブートストラップを使用してツールチップを使用することもできます。これにより、ホバー時に情報が表示されます: Bootstrap Tooltips

于 2013-10-18T01:34:20.010 に答える