ぬじろぐ

配布とフレンドに全力で寄りかかるソシャゲ日記

ニコ動の外部貼り付け模索

せっかくサイトのデザインをレスポンシブにしたのに、ニコニコの外部貼り付けタグを使うとはみ出てかっこ悪いしスマホでの取り回しも悪い…ということでどうにかしました。

http://d.hatena.ne.jp/sikii_j/20080814/p1
こちらを参照に、まずブックマークレートを改造

javascript: (function(){ var test=prompt('以下のタグをコピペ','<div class="nico_item"><a href="'+document.URL+'" target="_blank"><img src="http://tn-skr.smilevideo.jp/smile?i='+document.URL.substring(32)+'" alt="'+document.title+'">'+document.title+'</a></div>'); })();

これをブクマに登録して、貼り付けたい動画のページでぽちっとすると

<div class="nico_item"><a href="動画アドレス"></a><img src="サムネイルアドレス">動画タイトル</a></div>

こうなります。
div要素の部分は、CSSでデザインをいじるためのもの。

んで、CSSをこんな感じかな?

.nico_item{border:solid 1px #ccc;
           padding:5px; 
           max-width:320px;
           /* Firefox */
              background: -moz-linear-gradient(top center, #fff 0%, #efefef 100%);
           /* Chrom , Safari */
           background: -webkit-gradient(linear, center top, center bottom, from(#fff), to(#efefef));
           }
.nico_item img{width:50%; height:50%; border:solid 2px #333;}
.nico_item a {font-weight:bold;
              color:#555;
              text-decoration: underline;}
.nico_item a:hover{color:#999;}