JavaScript初心者です。
クリックで画像と表示されている文字を切り替えたいのですが、
どのような方法がありますか?
画像のみ切り替え、文字のみ切り替えなどの方法はそれぞれ試してみたのですが、同時に両方を切り替える方法がわかりませんでした。
下記コード(※元URL→http://weboook.blog22.fc2.com/blog-entry-6.html)を参考にしているのですが、画像にリンクの部分が不要なのと、
ボタンになってしまっているところを画像に変更したいと思っていますが、
うまく動作しません。
どなたかご教授お願い致します。
<SCRIPT type="text/javascript">
<!--
function showimg1(){
document.imgLink.src = "画像1のURL";
document.getElementById("linkArea").href = "リンク先URL";
document.getElementById("message").innerHTML = "表示する文章1";
}
function showimg2(){
document.imgLink.src = "画像2のURL";
document.getElementById("linkArea").href = "リンク先URL";
document.getElementById("message").innerHTML = "表示する文章2";
}
function showimg3(){
document.imgLink.src = "画像3のURL";
document.getElementById("linkArea").href = "リンク先URL";
document.getElementById("message").innerHTML = "表示する文章3";
}
-->
</SCRIPT>
<a href="最初のリンク先URL" id="linkArea" >
<img src="最初に表示する画像のURL" name="imgLink">
</a>
<div id="message">最初に表示する文章</div>
<input type="button" onclick="showimg1()" value="画像1">
<input type="button" onclick="showimg2()" value="画像2">
<input type="button" onclick="showimg3()" value="画像3">
みんなの回答 1 件
こんな感じ?
<SCRIPT type="text/javascript">
<!--
function showimg1(){
document.imgLink.src = "画像1のURL";
document.getElementById("message").innerHTML = "表示する文章1";
}
function showimg2(){
document.imgLink.src = "画像2のURL";
document.getElementById("message").innerHTML = "表示する文章2";
}
function showimg3(){
document.imgLink.src = "画像3のURL";
document.getElementById("message").innerHTML = "表示する文章3";
}
-->
</SCRIPT>
<img src="最初に表示する画像のURL" name="imgLink">
<div id="message">最初に表示する文章</div>
<a href="javascript:void(0)" onclick="showimg1();">画像</a><br>
<a href="javascript:void(0)" onclick="showimg2();">画像</a><br>
<a href="javascript:void(0)" onclick="showimg3();">画像</a><br>
関連するトピックス