あなたの運営するホームページやブログに「ねこカメラ」を表示させることができます。
あなたのページを飾る「ねこカメラ静止画モニター」の導入方法。
|
| ■ ねこカメラ静止画モニターを導入 |
モニターの画像のみを5秒間隔で自動更新するタイプ。ページ自体は更新しません。
下記のソースをコピーしてご利用ください。
@とAはセットです。両方を表示させたいページのHTMLソースへ貼り付けてください。
*下記ソースは、画像サイズ320×240のフルサイズで書いてあります。
表示させる画像の大きさを決めているのは「A」の「width="320"
height="240"」です。
縮小変更する場合は下項縮小サイズ表を参照し上の数字部分を変更して下さい。
|
| @ <TITLE></TITLE>の下に貼り付けます /ねこカメラ・メインの場合 |
<SCRIPT LANGUAGE="JavaScript">
<!--
function RefreshImg()
{
uniq = new Date();
uniq = "?"+uniq.getTime();
newImage = document.imgToLoad.src;
index = newImage.indexOf("?", 0);
if (index > 0)
{
newImage = newImage.substr(0, index);
}
document.imgToLoad.src = "http://www.asahitelevision.com/ilc/cam.jpg"+uniq;
}
// -->
</SCRIPT>
|
| A 画像を表示させたい位置に貼り付ける /ねこカメラ・メインの場合 |
<TBODY>
<TR>
<TD><A href="http://www.asahitelevision.com/" target="_blank"><IMG
src="http://www.asahitelevision.com/ilc/cam.jpg" alt="ATV
LIVE CAM・ねこカメラ" name="imgToLoad" onload='setTimeout("RefreshImg()",
5000)' onerror='setTimeout("RefreshImg()", 5000)' onabort='setTimeout("RefreshImg()",
5000)' id="imgToLoad" naturalsizeflag="0" width="320"
height="240" border="0"></A></TD>
</TR>
<TR>
<TD align="center"><A href="http://www.asahitelevision.com/" target="_blank"><FONT style="font-size: 10pt" color="#0000ff">ATV あさひテレビジョン</FONT></A></TD>
</TR>
</TBODY>
</TABLE> |
他のカメラ画像を表示させる場合は、下のソースをご覧下さい。
|
|
|
| ■ 縮小サイズ表 |
サイズの変更は縦横比さえ正しけれは下表にこだわる必要はありません。
下の数字はあくまでも一例です。そのままお使いいただいても、また目安にされてもかまいません。
|
標準サイズ |
横長サイズ(スタジオのみ) |
| 標準(フル) |
width="320" height="240" |
width="346" height="240" |
|
width="270" height="202" |
width="300" height="208" |
|
width="220" height="165" |
width="270" height="187" |
|
width="200" height="150" |
width="220" height="152" |
|
width="180" height="135" |
width="200" height="138" |
|
width="160" height="120" |
width="180" height="124" |
|
width="140" height="105" |
width="160" height="110" |
|
width="120" height="90" |
width="140" height="97" |
|
width="100" height="75" |
width="120" height="83" |
|
|
width="100" height="69" |
|
|
| ◆ ねこカメラ・U |
| @ <TITLE></TITLE>の下に貼り付けます |
<SCRIPT LANGUAGE="JavaScript">
<!--
function RefreshImg()
{
uniq = new Date();
uniq = "?"+uniq.getTime();
newImage = document.imgToLoad.src;
index = newImage.indexOf("?", 0);
if (index > 0)
{
newImage = newImage.substr(0, index);
}
document.imgToLoad.src = "http://www.asahitelevision.com/ilc/cam5.jpg"+uniq;
}
// -->
</SCRIPT>
|
| A 画像を表示させたい位置に貼り付ける |
<TBODY>
<TR>
<TD><A href="http://www.asahitelevision.com/" target="_blank"><IMG
src="http://www.asahitelevision.com/ilc/cam5.jpg" alt="ATV
LIVE CAM・ねこカメラ" name="imgToLoad" onload='setTimeout("RefreshImg()",
5000)' onerror='setTimeout("RefreshImg()", 5000)' onabort='setTimeout("RefreshImg()",
5000)' id="imgToLoad" naturalsizeflag="0" width="320"
height="240" border="0"></A></TD>
</TR>
<TR>
<TD align="center"><A href="http://www.asahitelevision.com/" target="_blank"><FONT style="font-size: 10pt" color="#0000ff">ATV あさひテレビジョン</FONT></A></TD>
</TR>
</TBODY>
</TABLE> |
|
| ◆ ねこカメラ・フォロー |
| @ <TITLE></TITLE>の下に貼り付けます |
<SCRIPT LANGUAGE="JavaScript">
<!--
function RefreshImg()
{
uniq = new Date();
uniq = "?"+uniq.getTime();
newImage = document.imgToLoad.src;
index = newImage.indexOf("?", 0);
if (index > 0)
{
newImage = newImage.substr(0, index);
}
document.imgToLoad.src = "http://www.asahitelevision.com/ilc/cam6.jpg"+uniq;
}
// -->
</SCRIPT>
|
| A 画像を表示させたい位置に貼り付ける |
<TBODY>
<TR>
<TD><A href="http://www.asahitelevision.com/" target="_blank"><IMG
src="http://www.asahitelevision.com/ilc/cam6.jpg" alt="ATV
LIVE CAM・ねこカメラ" name="imgToLoad" onload='setTimeout("RefreshImg()",
5000)' onerror='setTimeout("RefreshImg()", 5000)' onabort='setTimeout("RefreshImg()",
5000)' id="imgToLoad" naturalsizeflag="0" width="320"
height="240" border="0"></A></TD>
</TR>
<TR>
<TD align="center"><A href="http://www.asahitelevision.com/" target="_blank"><FONT style="font-size: 10pt" color="#0000ff">ATV あさひテレビジョン</FONT></A></TD>
</TR>
</TBODY>
</TABLE> |
|
| ◆ ねこカメラ・フォローU |
| @ <TITLE></TITLE>の下に貼り付けます |
<SCRIPT LANGUAGE="JavaScript">
<!--
function RefreshImg()
{
uniq = new Date();
uniq = "?"+uniq.getTime();
newImage = document.imgToLoad.src;
index = newImage.indexOf("?", 0);
if (index > 0)
{
newImage = newImage.substr(0, index);
}
document.imgToLoad.src = "http://www.asahitelevision.com/ilc/cam8.jpg"+uniq;
}
// -->
</SCRIPT>
|
| A 画像を表示させたい位置に貼り付ける |
<TBODY>
<TR>
<TD><A href="http://www.asahitelevision.com/" target="_blank"><IMG
src="http://www.asahitelevision.com/ilc/cam8.jpg" alt="ATV
LIVE CAM・ねこカメラ" name="imgToLoad" onload='setTimeout("RefreshImg()",
5000)' onerror='setTimeout("RefreshImg()", 5000)' onabort='setTimeout("RefreshImg()",
5000)' id="imgToLoad" naturalsizeflag="0" width="320"
height="240" border="0"></A></TD>
</TR>
<TR>
<TD align="center"><A href="http://www.asahitelevision.com/" target="_blank"><FONT style="font-size: 10pt" color="#0000ff">ATV あさひテレビジョン</FONT></A></TD>
</TR>
</TBODY>
</TABLE> |
|
| ◆ ねこカメラ・フィールド中継F11M |
| @ <TITLE></TITLE>の下に貼り付けます |
<SCRIPT LANGUAGE="JavaScript">
<!--
function RefreshImg()
{
uniq = new Date();
uniq = "?"+uniq.getTime();
newImage = document.imgToLoad.src;
index = newImage.indexOf("?", 0);
if (index > 0)
{
newImage = newImage.substr(0, index);
}
document.imgToLoad.src = "http://www.asahitelevision.com/ilc/cam11.jpg"+uniq;
}
// -->
</SCRIPT>
|
| A 画像を表示させたい位置に貼り付ける |
<TBODY>
<TR>
<TD><A href="http://www.asahitelevision.com/" target="_blank"><IMG
src="http://www.asahitelevision.com/ilc/cam11.jpg" alt="ATV
LIVE CAM・ねこカメラ" name="imgToLoad" onload='setTimeout("RefreshImg()",
5000)' onerror='setTimeout("RefreshImg()", 5000)' onabort='setTimeout("RefreshImg()",
5000)' id="imgToLoad" naturalsizeflag="0" width="320"
height="240" border="0"></A></TD>
</TR>
<TR>
<TD align="center"><A href="http://www.asahitelevision.com/" target="_blank"><FONT style="font-size: 10pt" color="#0000ff">ATV あさひテレビジョン</FONT></A></TD>
</TR>
</TBODY>
</TABLE>
<CENTER> |
|
| ◆ ねこカメラ・ATV生スタジオ101 |
| @ <TITLE></TITLE>の下に貼り付けます |
<SCRIPT LANGUAGE="JavaScript">
<!--
function RefreshImg()
{
uniq = new Date();
uniq = "?"+uniq.getTime();
newImage = document.imgToLoad.src;
index = newImage.indexOf("?", 0);
if (index > 0)
{
newImage = newImage.substr(0, index);
}
document.imgToLoad.src = "http://www.asahitelevision.com/ilc/cam101a.jpg"+uniq;
}
// -->
</SCRIPT>
|
| A 画像を表示させたい位置に貼り付ける |
<TBODY>
<TR>
<TD><A href="http://www.asahitelevision.com/" target="_blank"><IMG
src="http://www.asahitelevision.com/ilc/cam101a.jpg" alt="ATV
LIVE CAM・ねこカメラ" name="imgToLoad" onload='setTimeout("RefreshImg()",
5000)' onerror='setTimeout("RefreshImg()", 5000)' onabort='setTimeout("RefreshImg()",
5000)' id="imgToLoad" naturalsizeflag="0" width="346"
height="240" border="0"></A></TD>
</TR>
<TR>
<TD align="center"><A href="http://www.asahitelevision.com/" target="_blank"><FONT style="font-size: 10pt" color="#0000ff">ATV あさひテレビジョン</FONT></A></TD>
</TR>
</TBODY>
</TABLE> |
|
| ■ページ自体を更新させる場合/META |
上記SCRIPTが他と競合したりうまく働かない場合やページ自体を更新させたい場合、METAを使ってコントロールすることもできます。
HTMLソースの<HEAD>下に下記を付け加えます。
| @ <HEAD>下に貼り付けます |
| <META http-equiv="refresh" content="5"> |
| A 画像を表示させたい位置に貼り付ける |
<TABLE border="0">
<TBODY>
<TR>
<TD><A href="http://www.asahitelevision.com/" target="_blank"><IMG
src="http://www.asahitelevision.com/ilc/cam.jpg" alt="ATV
LIVE CAM・ねこカメラ" width="320" height="240"
border="0"></A></TD>
</TR>
<TR>
<TD align="center"><A href="http://www.asahitelevision.com/" target="_blank"><FONT style="font-size: 10pt" color="#0000ff">ATV あさひテレビジョン</FONT></A></TD>
</TR>
</TBODY>
</TABLE> |
*表示させるページが静止画モニター専用の場合にお使い下さい。
5秒毎に自動更新がかかりますので、他の記事や画像があると表示に時間がかかるなど不都合なことになります。
|
他のカメラに画像を変える場合
「A」の下記ソースにある太字部分を書き換えてください。
<TD><A href="http://www.asahitelevision.com/" target="_blank"><IMG
src="http://www.asahitelevision.com/ilc/cam.jpg" alt="ATV LIVE CAM・ねこカメラ" width="320" height="240"
border="0"></A></TD>
|
メイン |
cam.jpg |
|
U |
cam5.jpg |
|
フォロー |
cam6.jpg |
|
フォローU |
cam8.jpg |
|
フィールド中継F11M |
cam11.jpg |
|
ATV生スタジオ101 |
cam101a.jpg |
|