• ベストアンサー

続きを表示するで、

《続きを表示》をクリックすると、 本文が表示されるのと同時に、関連資料のサイトを別ウィンドウで開けるようにするには、どうしたらよろしいですか? よろしくお願いします。

質問者が選んだベストアンサー

  • ベストアンサー
  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.1

>《続きを表示》をクリックすると、本文が表示されるのと同時に、 >関連資料のサイトを別ウィンドウで開けるようにするには javascriptでよければ可能ですが、クリックする度に別ウィンドウを開かれたのでは、続きを読むどころではなくうざったく感じるような気がしますが… どのような文書構造なのかまったく不明なので、ご参考までに。 (表示のために、インデントを全角空白に変えています) <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html lang="ja"> <head><title>sample</title> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <style type="text/css"> a.stretch_show, a.stretch_hide{ text-decoration: none; text-align: center; display: block; font-size: 85%; width: 7em; color: #000; border-right: 1px solid #464; border-bottom: 1px solid #464; background-color: #dfe; } </style> </head> <body> <div class="stretch"> 文章1<br>(前半) <a href="http://www.yahoo.co.jp/" class="stretch_show">続きを表示</a> <p class="stretch_hidden"> 文章1<br>(後半) <a href="#" class="stretch_hide">隠す</a> </p> </div> <div class="stretch"> 文章2<br>(前半) <a href="http://www.google.co.jp/" class="stretch_show">続きを表示</a> <div class="stretch stretch_hidden"> 文章2<br>(中間) <a href="#" class="stretch_hide">隠す</a> <a href="http://www.bing.com/" class="stretch_show">続きを表示</a> <p class="stretch_hidden"> 文章2<br>(後半) <a href="#" class="stretch_hide">隠す</a> </p> </div> </div> <script type="text/javascript"> <!-- /*@cc_on@*/ (function(search){ // *** イベント処理 ***  var listener = function(evt){   var t = evt./*@if(1) srcElement @else@*/ target /*@end@*/;   var e, c = t.className;   if(t.nodeName=="A" && c.match(/\bstretch_(show|hide)\b/)){ // 表示処理    if(c=="stretch_show"){     if(e = search(t, "stretch_hidden")){      e.style.display = "";      t.style.display = "none";      window.open(t.href, "_blank");     }    } else { // 非表示処理     if(e = search(t, "stretch_hidden", 1)){      e.style.display = "none";      if(e = search(e, "stretch_show")) e.style.display = "";     }    } // リンクをキャンセル    evt./*@if(1) returnValue = false     @else@*/ preventDefault() /*@end@*/;   }  } // *** 初期設定 ***  var a = document.getElementsByTagName("a");  var i, e, c, elm;  for(i=0; e=a[i++];){   if((c=e.className) && c.match(/\bstretch_show\b/)){    elm = search(e, "stretch_hidden");    if(elm) elm.style.display = "none";   }  }  document./*@if(1)attachEvent('on'+   @else@*/addEventListener(   /*@end@*/'click', listener, false); })(function(elm, cls, dir){  var es, i, e = elm.parentNode,    reg = "\\b" + cls + "\\b";  if(dir){    e = (e.className && e.className.match(reg))?e:null;  } else {   for(i=0, es=e.childNodes; e=es[i++];)    if(e.className && e.className.match(reg)) break;  }  return e; }); //--> </script> </body> </html>

関連するQ&A