しばらくの間、このポートフォリオのヘッダーのようなものをやろうとしてきました。矢印をクリックすると、同じ行に異なるコメントを表示できます。また、きれいなものは何もリフレッシュしません。質問をどのように表現するかわかりません。私はついにこの例を見つけました。JS または jQuery コードを手伝ってくれる人はいますか? さまざまな言い回しを試みる前にこれが回答されていた場合は申し訳ありませんが、回答が見つからないようです。
質問する
76 次
1 に答える
1
お手軽モード!これはjsfiddleで動作するデモです
いくつかのhtmlをセットアップします
<p>
I'm a <span id="remark">Panda</span> bear.
<button id="nextRemark">refresh</button>
<img src="http://i.imgur.com/cFadsAE.gif" id="spinner"/>
<p>
JavaScript を書く (jQuery を使用)
$(function(){
var remarks = ["Koala", "Kangaroo", "Circus", "Grizzly"],
spinner = $("#spinner"),
delay = 1000;
$("#nextRemark").click(function(event) {
var button = $(this);
// display spinner, hide button
spinner.show();
button.hide();
setTimeout(function() {
var r;
// display remark
if (r = remarks.pop()) {
$("#remark").text(r);
}
// no more remarks
else {
$("#remark").text("dead");
button.remove();
}
// hide spinner, show button
spinner.hide();
button.show();
}, delay);
event.preventDefault();
});
});
派手なアニメーションや余分な遅延はありませんが、それが要点です。
于 2013-08-24T22:09:54.507 に答える