2011年04月17日

その方法

 この方法を使うにはまず、[設定]−[ブログ設定]へ行き、「画像詳細ページ」を「表示しない」にして、Seesaaの画像詳細ページを表示しないよう にしてください。

 つぎに、javascriptのファイル「imageview.js」をダウンロードし、ご自分のファイルスペースへ、アップロードしてください。
 「imageview.js」は<http://yf-blog-lab- 2.up.seesaa.net/js/imageview.js>にあります。
 または、このURLに直接リンクして頂いても構いません。
 「imageview.js」は、私の著作物ですが、自由にご使用いただいて構いません。ただし、全ての責務は負いません。

 さて、一つ前の記事の、この方法の肝となる記述はつぎのとおりです。
<script type="text/javascript" src="http://yf-blog-lab-2.up.seesaa.net/js/imageview.js">
</script>
<img src="http://yf-blog-lab-2.up.seesaa.net/image/sak_073.jpg" width=200 height=150 onclick="imageview('桜', 'S-Hoshino.com', 'http://yf-blog-lab-2.up.seesaa.net/image/sak_073.jpg');" oncontextmenu="alert('ストリーム許諾のためDLは出来ません');return false;" />

 それでは、説明のための番号を付け、説明いたします。
<script type="text/javascript" src="<1>http://yf-blog-lab-2.up.seesaa.net/js/imageview.js">
</script>
<img src="<2>http://yf-blog-lab-2.up.seesaa.net/image/sak_073.jpg" <3>width=200 height=150 onclick="imageview('<4>', '<5>S-Hoshino.com', '<6>http://yf-blog-lab-2.up.seesaa.net/image/sak_073.jpg');" oncontextmenu="alert('<7>ス トリーム許諾のためDLは出来ません');return false;" />
<1>「imageview.js」 のあるURLを書いてください。
 - ご自分のファイルスペースにアップロードされた場合はそのURLを、私のファイルスペースへ直接リンクされる場合はこのままです。
<2>ブ ログ記事に貼り付ける(縮小)画像のURLを書いてください。
 - 縮小表示用の画像を別に用意することも、原寸用の画像を縮小表示することもできます。
<3>ブ ログ記事に貼り付ける(縮小)画像の大きさをを書いてください。
 - 原寸用の画像を縮小表示する場合は書いてください。
<4>(原 寸)画像表示ページ、1行目に表示される「タイトル」などを書いてください。
<5>(原 寸)画像表示ページ、2行目に表示される「作者」などを書いてください。
<6>(原 寸)画像表示ページに貼り付ける画像のURLを書いてください。
<7>ブ ログ記事に貼り付けた(縮小)画像を、右クリックしたときに表示されるメッセージを書いてください。
 - (原寸)画像表示ページの画像を、右クリックしたときに表示されるメッセージは、「imageview.js」の中に書かれています。
 - 「imageview.js」は、メモ帳などテキストエディタで編集できます。自由に変更していただいて構いません。

posted by わいずふぁくとりい at 18:51| Comment(0) | TrackBack(0) | ダウンロードできないように画像を貼ろう | このブログの読者になる | 更新情報をチェックする

ダウンロードできないように画像を貼ろう

 Seesaaに、普通に画像を貼ると、右クリックでダウンロードできたり、左クリックで画像詳細ページへ行き、結局ダウンロードできてしまいます。

 そこで、画像を小さく貼って、右クリックを阻止し、左クリックで大きな画像を表示する。
 大きな画像の右クリックも、当然阻止する。
 そのような方法を、javascriptも利用して、実現してみました。

 なお、ここで紹介する方法を施しても、完全にダウンロードを阻止することはできません。
 ダウンロードできる、いくつかの方法は残ってしまいますので、ご了承ください。



 この画像は「S-Hoshino.com」さんのフリー写真素材を使用しています。

バグ修正>>
posted by わいずふぁくとりい at 17:27| Comment(0) | TrackBack(0) | ダウンロードできないように画像を貼ろう | このブログの読者になる | 更新情報をチェックする

2006年05月27日

記事のバックには違う色を塗る

 記事の部分のバックを、違う色で塗ってみます。
 ついでに文字の色も変えてみます。
 .blog {  } に、color:#1E9B23; と、background-color:#FFF5BF; を追加します。

 赤文字部分が 追加部分です。
.blog {
margin:0px;
text-align:left;
margin-left:15px;
color:#1E9B23;
background-color:#FFF5BF;
}
posted by わいずふぁくとりい at 22:12| Comment(0) | TrackBack(0) | ブログの塗り絵をしてみよう | このブログの読者になる | 更新情報をチェックする

塗り残した上下にも塗る

 ブログ全体の背景に色を塗りましたが、上の部分と下に、ぽっかり白い部分が残っています。
 この部分にも塗ってみたいと思います。
 同じ色を塗った方が、いいのかも知れませんが、今回はわかりやすくするために少し違う色を塗ります。
 #banner {  } と、#footer {  } の、background-color:#FFF;を編集します。

 これを行っても、まだ上のほうに塗り残しが、残ります。
 これは、画像の一部になっているので、今のところ仕方ありません。

 編集前はつぎのとおりです。

#banner{
font-family:arial, Helvetica;
height:140px;
margin:0px;
padding:0px 0px 0px 0px;
text-align:left;
background-image:url(http://blog.seesaa.jp/img/bg/orange/header.gif);
background-repeat:no-repeat;
background-color:#FFF;
}

 これをつぎのように編集します。違いは赤 文字部分です。

#banner{
font-family:arial, Helvetica;
height:140px;
margin:0px;
padding:0px 0px 0px 0px;
text-align:left;
background-image:url(http://blog.seesaa.jp/img/bg/orange/header.gif);
background-repeat:no-repeat;
background-color:#FC7F87;
}

 #footerも同じように。編集前。

#footer{
clear:left;
padding:20px 0px; 5px 0px
text-align:center;
height:80px;
background-color:#FFF;
}

 編集後

#footer{
clear:left;
padding:20px 0px; 5px 0px
text-align:center;
height:80px;
background-color:#FC7F87;
}

posted by わいずふぁくとりい at 10:58| Comment(0) | TrackBack(0) | ブログの塗り絵をしてみよう | このブログの読者になる | 更新情報をチェックする

バック全体に色をつける

 このブログでは、スタイルシートを編集して、ブログの色を変えてみたいと思います。
 まずは、ブログのバック全体に、ピンクっぽい色を塗ってみます。
 スタイルシートを開くと最初に現れる、body {  } のなかの、background-color:#FFF;を編集します。
 スタイルシートの編集は、[デザイン]−[スタイルシート]で、スタイルシートの名称をクリックすると行えます。

 編集前はつぎのとおりです。

body {
font-family: Arial, Helvetica, sans-serif;
margin:0px;
padding:0px;
text-align:center;
background-image:url(http://blog.seesaa.jp/img/bg/orange/bg.gif);
background-repeat:repeat-x;
background-color:#FFF;
}

 これをつぎのように編集します。違いは赤 文字部分です。

body {
font-family: Arial, Helvetica, sans-serif;
margin:0px;
padding:0px;
text-align:center;
background-image:url(http://blog.seesaa.jp/img/bg/orange/bg.gif);
background-repeat:repeat-x;
background-color:#FDEAF0;
}

posted by わいずふぁくとりい at 00:29| Comment(0) | TrackBack(0) | ブログの塗り絵をしてみよう | このブログの読者になる | 更新情報をチェックする

広告


この広告は60日以上更新がないブログに表示がされております。

以下のいずれかの方法で非表示にすることが可能です。

・記事の投稿、編集をおこなう
・マイブログの【設定】 > 【広告設定】 より、「60日間更新が無い場合」 の 「広告を表示しない」にチェックを入れて保存する。


×

この広告は1年以上新しい記事の投稿がないブログに表示されております。