@charset "utf-8";
/*
-----------------------------------------
【CSS編集 目次】
(1) 文字のスタイル
(2) ボタンのスタイル
(3) エリアのスタイル
(4) その他、拡張
※CSS編集で広告を修正しないでください
(規約違反に該当する可能性があります)
-----------------------------------------
*/
/*
*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*
(1) 文字のスタイル
*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*
*/
/* (1-1) 全体の文字
--------------------------------------------*/
/* 通常文字 */
.skinTextColor,.skinBaseTextColor,.skinBlock,body{
color:#333333; text-shadow: gray 1px 1px 2px;
font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'MS Pゴシック',sans-serif;}
/* リンク */
.skinAnchorColor,.skinBaseAnchorColor,.skinBlock a,a{
color:#333333;
}
/* 訪問済のリンク */
.skinAnchorVisitedColor,.skinBaseAnchorVisitedColor,.skinBlock a:visited,a:visited{
color:#996699;
}
/* マウスオーバーしたときのリンク */
.skinAnchorHoverColor,.skinBaseAnchorHoverColor,.skinBlock a:focus,.skinBlock a:hover,a:focus,a:hover{
color:#ff3366;
}
/* 弱い文字 (日付など)*/
.skinWeakColor,.skinBaseWeakColor{
color:#999999;
}
/* 強い文字 (NEW! 更新!など)*/
.skinStrongColor,.skinBaseStrongColor{
color:#ff3399;
}
/* (1-2) ブログタイトル文字
--------------------------------------------*/
/* skinTitle ブログタイトル文字 */
.skinTitle,.skinTitle:visited,.skinTitle:hover,.skinTitle:focus{
color:#000000;
font-weight:bold;
font-size:2.11em;
}
/* skinDescription ブログの説明文字 */
.skinDescription{
color:#333333;
}
/* (1-3) 記事/メッセージボード内の文字のスタイル
--------------------------------------------*/
/* skinArticleTitle 記事タイトル文字 */
.skinArticleTitle,.skinArticleTitle:hover,.skinArticleTitle:focus,.skinArticleTitle:visited{
font-size:1.31em;
font-weight:bold;
color:#0066cc;
}
/* (1-4) サイドバー内の文字のスタイル
--------------------------------------------*/
/* skinMenuTitle サイドメニュータイトル文字 */
.skinMenuTitle{}
/*
*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*
(2) ボタンのスタイル
※ボタンの背景画像や文字の色などを指定
*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*
*/
/* (2-1) ボタン[横180px 縦35px]
--------------------------------------------*/
/* ボタンの背景画像 ※[横180px 縦35px]のボタンの背景画像を指定 */
.skinImgBtnM{
background-image:url(http://stat100.ameba.jp/p_skin/wu_pf_cssedit/img/skin_btn_m.png);
}
/* ボタンの文字色 */
.skinImgBtnM:hover span,.skinImgBtnM:focus span,.skinImgBtnM span{
color:#333333 !important;
}
/* (2-2) アイコン付きボタン[横128px 縦28px]
--------------------------------------------*/
/* アイコン付き ボタンの背景画像 ※[横128px 縦28px]のボタンの背景画像を指定 */
.skinImgBtnS{
background-image:url(http://stat100.ameba.jp/p_skin/wu_pf_cssedit/img/skin_btn_s.png);
}
.skinImgBtnS:hover span,.skinImgBtnS:focus span,.skinImgBtnS span{
/*
アイコン画像は下記から指定
menu_icons_pastel.png (パステル)
menu_icons_gray.png(グレー)
menu_icons_black.png(黒)
menu_icons_white.png(白)
*/
background-image:url(http://stat100.ameba.jp/common_style/img/skin/cmn/icons/menu_icons/menu_icons_pastel.png);
color:#333333 !important;/* ←ボタンの文字色 */
}
/* (2-3) ページ送りボタンの << 次へ 、前へ >> 、「次の記事タイトル」 >> ボタン
--------------------------------------------*/
.skinSimpleBtn,.skinSimpleBtn:visited,.skinSimpleBtn:hover,.skinSimpleBtn:focus{
border:1px solid #dddddd;
background:#ffffff;
color:#0066cc !important;
}
/* ボタンにマウスオーバー */
.skinSimpleBtn:hover,.skinSimpleBtn:focus{
background:#f7f7f7;
}
/*
*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*
(3) エリアのスタイル
※背景画像、サイズ、ボーダーなどを各部分ごとに指定
*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*
*/
/* (3-1) ボディ(全体)
--------------------------------------------*/
/* skinBody ボディ */
.skinBody{}/* ←ブログ全体に背景を敷きたいとき */
.skinBody2{}
.skinBody3{}
/* (3-2) ブログヘッダー
--------------------------------------------*/
/* skinHeaderArea ブログヘッダー980pxエリア */
.skinHeaderArea{}/* ←ブログヘッダーに背景画像を敷きたいとき */
/* skinBlogHeadingGroupArea タイトルと説明を囲うエリア */
.skinBlogHeadingGroupArea{
padding:20px 0 30px;
}
/* skinTitleArea ブログタイトルのエリア */
.skinTitleArea{
padding-bottom:4px;
}
/* skinDescriptionArea ブログの説明エリア */
.skinDescriptionArea{}
/* (3-3) コンテンツエリア
--------------------------------------------*/
/* skinContentsArea コンテンツ980pxエリア */
.skinContentsArea{
/* 注 ベースのcssにwidth:980px;の記述有り */
}
/* (3-4) メインエリア
--------------------------------------------*/
.skinMainArea{
padding-right:20px;
padding-left:20px;
}
/* (3-5) メッセージボード
--------------------------------------------*/
.skinMessageBoard{
/* 注 ベースのcssに margin-bottom の記述有り */
border-top:1px dotted #979797;
border-bottom:1px dotted #979797;
background:#ffffff;/* ←メッセージボードに背景を敷きたいとき */
}
.skinMessageBoard2{}
.skinMessageBoard3{
padding:16px 30px;
}
/* (3-6) 記事
--------------------------------------------*/
/* skinArticle 記事エリア */
.skinArticle{
/* 注 ベースのcssに margin-bottom の記述有り */
padding:16px 0;
border:1px solid #dddddd;
background:#ffffff;/* ←記事に背景を敷きたいとき */
box-shadow: gray 2px 1px 7px;
}
.skinArticle2{}
.skinArticle3{}
/* skinArticleHeader 記事タイトルエリア */
.skinArticleHeader{
/*margin:0 29px;
padding:2px 10px;*/
border-left:none;
font-size:17px;
}
.skinArticleHeader2{
padding-top:15px;
padding-bottom:15px;
padding-left:0px;
text-align:center;
}
/* skinArticleBody 記事本文エリア */
.skinArticleBody{}
.skinArticleBody2{
margin:0 29px;
}
/* skinArticleFooter 記事フッターエリア */
.skinArticleFooter{
margin:10px 29px 0;
border-top:1px dotted #949494;
}
/* (3-7) サイドバーエリア
--------------------------------------------*/
.skinSubArea{} /* サイドバーエリア共通 */
.skinSubA{} /* 300pxのサイドバーエリア */
.skinSubB{} /* 180pxのサイドバーエリア */
/* (3-8) サイドバー メニュー
--------------------------------------------*/
/* skinMenu サイドバー メニューのエリア */
.skinMenu{
/* 注 ベースのcssに margin-bottom の記述有り */
background:transparent;/* ←サイドメニューに背景を敷きたいとき */
}
.skinMenu2{
padding-right:30px;
padding-left:30px;
}
/* skinMenuHeader サイドメニュータイトルエリア */
.skinMenuHeader{
font-size:16px;
text-align:center;
font-weight:bold;
padding:5px 10px;
background:#e4e4e4;/* ←サイドメニューのタイトルに背景を敷きたいとき */
}
/* skinMenuBody サイドメニュー本文エリア */
.skinMenuBody{
background:none;
margin:-10px;
margin-top:0px;
margin-bottom:10px;
padding:10px;
border: 1px solid #dddddd;/*I*/
background:#ffffff;/* ←サイドメニューの本文に背景を敷きたいとき */
box-shadow: gray 2px 1px 7px;
}
/* (3-9) サイドバーの リスト画像、ボーダー ※要素のbottomに指定すること
--------------------------------------------*/
.skinSubHr,
.skinSubList li{
margin-bottom:3px;
padding-bottom:3px;
border-bottom:1px dotted #b3b3b3;
}
/* (3-10) コメント欄、記事一覧などの一覧
--------------------------------------------*/
/* 背景色 */
.skinBgColor,.skinBaseBgColor,.skinBlock{
background-color:#ffffff;
}
/* 弱い背景色 */
.skinWeakBgColor,.skinBaseWeakBgColor{
background-color:#f7f7f7;
}
/* 強い背景色 */
.skinStrongBgColor,.skinBaseStrongBgColor{
background-color:#f7f7f7;
}
/* 枠線の色 */
.skinBorderColor,.skinBaseBorderColor,.skinBlock{
border-color:#dddddd;
}
/* 境界線の色 */
.skinBorderHr,.skinBorderList li{
border-color:#b3b3b3;
}
/*
*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*
(4) その他、拡張
*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*
*/
/* その他、拡張があれば記述 */
/* アメブロヘッダー画像設定用CSS貼り付けコード */
.skinHeaderArea{
height:460px;
background-image:url(http://stat.ameba.jp/user_images/20121122/18/11derful/33/42/p/o0408045012297679578.png);
background-repeat:no-repeat;
background-position:center right;
}
body{
background-color:#000033;
background-image:url("http://stat.blogskin.ameba.jp/blogskin_images/20121104/16/b2/6f/p/o0220022811derful1352015838200.png");
background-position:center top;
background-repeat:repeat;
background-attachment:fixed;
}
/* ▼▼背景の影 ここから▼▼ */
/*
div.skinFrame{
width:1100px; /*フレーム横幅*/
background: ;
opacity: 0.90;
filter: alpha(opacity=90);
-ms-filter: alpha(opacity=90);
background-image:url("");
background-position:center top;
background-attachment:scroll;
background-repeat:repeat;
border-left:solid 1px #d3d3d3; /*左縦線*/
border-right:solid 1px #d3d3d3; /*右縦線*/
margin:auto;
padding:auto;
-webkit-box-shadow: 0px 0px 20px 5px #757575;
-moz-box-shadow: 0px 0px 20px 5px #757575;
box-shadow: 0px 0px 20px 5px #757575;
}*/
/* ▲▲背景の影 ここまで▲▲ */
/* skinDescription ブログの説明文字 */
.skinDescriptionArea {
margin: 0px 0 0 300px; /* 左から上右下左 */
}
/* skinTitle ブログタイトル文字 */
.skinTitle,.skinTitle:visited,.skinTitle:hover,.skinTitle:focus{
color:#c0c0c0;
font-weight:bold;
font-size:40px;
text-shadow: -1px -1px 0px #202020, 1px 1px 0px #fff;
}
/* skinDescription ブログの説明文字 */
.skinDescription{
color:#d3d3d3;
font-size:15px;
font-weight:bold;
text-shadow: 1px 1px 0px white;
margin: 0px 0 0 200px; /* 左から上右下左 */}
/* skinTitle ブログタイトル文字 */
.skinTitleArea {
margin: 100px 0 0 150px;/* 左から上右下左 */
}
/*▼▼▼リボン風記事タイトル▼▼▼*/
.skinArticleTitle{
color:#ffffff;
}
.skinArticleHeader{
padding:0px 10px 20px 10px;
margin:0px -31px 0 -31px;
background:transparent;
}
.skinArticleHeader2{
background: #330066; /* Old browsers */
background: #330066;
background: -webkit-gradient(linear, left top, left bottom, from(#330066), to(#a3a1a1));
background: -webkit-linear-gradient(top, #330066, #a3a1a1);
background: -moz-linear-gradient(top, #330066, #a3a1a1);
background: -ms-linear-gradient(top, #330066, #a3a1a1);
background: -o-linear-gradient(top, #330066, #a3a1a1);
background-image: -ms-linear-gradient(top, #330066 0%, #a3a1a1 100%);
-webkit-box-shadow: rgba(000,000,000,0.3) 0 1px 1px;
-moz-box-shadow: rgba(000,000,000,0.3) 0 1px 1px;
color:#ffffff;
text-shadow: #000000 0 1px 0;
box-shadow: rgba(000,000,000,0.3) 0 3px 5px;
position:relative;
}
.skinArticleHeader2:before,
.skinArticleHeader2:after {
content: '';
position: absolute;
right: 0px;
bottom: -20px;
/**/
background:transparent;
border-color: transparent transparent transparent #a1a1a1;
border-style:solid;
border-width:20px;
width: 0;
height: 0;
border-top: 10px solid #333;
border-bottom: 10px solid transparent;
border-left: 10px solid #333;
border-right: 10px solid transparent;
}
.skinArticleHeader2:before {
left: 0px;
bottom: -20px;
right:auto;
width: 0;
height: 0;
border-top: 10px solid #333;
border-bottom: 10px solid transparent;
border-left: 10px solid transparent;
border-right: 10px solid #333;
}
/* ▲▲▲▲▲▲ */
/*記事横幅*/
.columnB .skinMainArea{width:600px;}
/*▼▼▼リボン風サイドタイトル▼▼▼*/
.skinMenuHeader{
padding:5px 10px 5px 10px;
margin:0px -30px 0 -30px;
background:transparent;
}
.skinMenuHeader{
background: #330066; /* Old browsers */
background: -webkit-gradient(linear, left top, left bottom, from(#330066), to(#a3a1a1));
background: -webkit-linear-gradient(top, #330066, #a3a1a1);
background: -moz-linear-gradient(top, #330066, #a3a1a1);
background: -ms-linear-gradient(top, #330066, #a3a1a1);
background: -o-linear-gradient(top, #330066, #a3a1a1);
background-image: -ms-linear-gradient(top, #330066 0%, #a3a1a1 100%);
-webkit-box-shadow: rgba(000,000,000,0.3) 0 1px 1px;
-moz-box-shadow: rgba(000,000,000,0.3) 0 1px 1px;
box-shadow: rgba(000,000,000,0.3) 0 3px 5px;
position:relative;
color: #ffffff;
text-shadow: #000000 0 1px 0;
}
.skinMenuHeader:before,
.skinMenuHeader:after {
content: '';
position: absolute;
right: 0px;
bottom: -20px;
width: 0;
height: 0;
border-top: 10px solid #333;
border-bottom: 10px solid transparent;
border-left: 10px solid #333;
border-right: 10px solid transparent;
}
.skinMenuHeader:before {
left: 0px;
bottom: -20px;
right:auto;
width: 0;
height: 0;
border-top: 10px solid #333;
border-bottom: 10px solid transparent;
border-left: 10px solid transparent;
border-right: 10px solid #333;
}
/* ▲▲▲▲▲▲ */
/* ▼▼プロフ不要削除ここから▼▼ */
/* メッセージを送る */
.profileMenu .profileBtnArea>li:first-child+li+li{display:none;}
/* プレゼントを贈る */
.profileMenu .profileBtnArea>li:first-child+li+li+li{display:none;}
/* アメンバーになる */
/*.profileMenu .profileBtnArea>li:first-child+li{display:none;}*/
/* プロフィール|ピグの部屋のみ */
.profileMenu .profileUserPages{display:none;}
/* ▲▲プロフ不要削除ここまで▲▲ */
/*フッターナビ削除*/
.footerNav{
display:none !important;
}
/*プロフ画像位置中央*/
.skinSubA .userProfileImageArea{margin-left:70px;}
/*プロフネーム*/
.skinSubA .profileUserNicknameArea{margin-left:50px;}
/*プロフ内ボタン位置中央*/
.skinSubArea ul, .skinSubArea li{margin-left:55px;}
/*テーマ位置中央*/
.skinSubArea ul, .skinSubList li{margin-left:0px;}
/*▼▼ブログ画像ボタン非表示▼▼*/
.imagelistLink {display:none!important;}
/*▼▼プロフボタン▼▼*/
.skinImgBtnS {
background:#ffffff;
border:1px solid #dddddd;
box-shadow: 0 1px 0 rgba(255, 255, 255, .2), inset 0 3px 3px rgba(0, 0, 0, .6), inset 0 1px 0 rgba(0, 0, 0, .4);
-moz-border-radius-topright: 20px;
-webkit-border-top-right-radius: 20px;
-khtml-border-radius-topright: 20px;
border-top-right-radius: 20px;
-moz-border-radius-bottomleft: 20px;
-webkit-border-bottom-left-radius: 20px;
-khtml-border-radius-bottomleft: 20px;
border-bottom-left-radius: 20px;
-moz-border-radius-topleft: 20px;
-webkit-border-top-left-radius: 20px;
-khtml-border-radius-topleft: 20px;
border-top-left-radius: 20px;
-moz-border-radius-bottomright: 20px;
-webkit-border-bottom-right-radius: 20px;
-khtml-border-radius-bottomright: 20px;
border-bottom-right-radius: 20px;
}
.skinImgBtnS:hover,.skinImgBtnS:focus{
background:#f7f7f7;
background-image:url(http://stat.ameba.jp/user_images/20121102/13/lucifer-d0v0b/35/6c/p/o0004000412266491362.png);
}
/* ▲▲▲▲▲▲ */
/* ▼▼▼▼メッセージボードの調整▼▼▼▼*/
.skinMessageBoard {
border:none;/*線を消す*/
}
/* ▲▲▲▲▲▲ */
/* ▼▼サイドカラム下ずらし▼▼ */
.columnB .skinSubA {
float: right;
width: 300px;
padding:50px 0 0 0;}
/* ▲▲▲▲▲▲ */
/* ▼▼記事下同じテーマの最新記事▼▼ */
.articleThemeListArea {
background: #ffffff;
margin:52px 0 12px 0px;
padding:10px 8px;
color:#4d4d4d;
text-shadow: #ffffff 0 1px 0;
font-variant: small-caps;
text-align:center;
position:relative;
-webkit-border-radius:4px;
-moz-border-radius:4px;
border-left:1px solid #036;
border-top:1px solid #036;
box-shadow:inset 1px 1px 4px #036;
border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
}
/* ▲▲▲▲▲▲ */
/* ページ送りボタンの << 次へ 、前へ >> 、「次の記事タイトル」 >> ボタン*/
.skinSimpleBtn,.skinSimpleBtn:visited,.skinSimpleBtn:hover,.skinSimpleBtn:focus{
border:1px solid #dddddd;
background:#ffffff;
color:#000000 !important;
box-shadow: 0 1px 0 rgba(255, 255, 255, .2), inset 0 3px 3px rgba(0, 0, 0, .6), inset 0 1px 0 rgba(0, 0, 0, .4);
}
/* ボタンにマウスオーバー */
.skinSimpleBtn:hover,.skinSimpleBtn:focus{
background:#f7f7f7;
background-image:url(http://stat.ameba.jp/user_images/20121102/13/lucifer-d0v0b/35/6c/p/o0004000412266491362.png);
}
/* ▲▲▲▲▲▲ */
/* ▲▲▲▲▲▲ */
/* ▼▼時計数字フォント▼▼ */
.articleTime {
font-family: Georgia,'Palatino Linotype','Monotype Corsiva',Verdana;
font-size: 100%;
color: rgb(78, 69, 74);
font-weight: bold;
text-shadow: 1px 1px 1px rgb(221, 221, 221);
}
/* ▲▲▲▲▲▲ */
.skinBody{
background:url(http://stat.blogskin.ameba.jp/blogskin_images/20121114/23/52/87/j/o0006080011derful1352902785679.jpg) fixed repeat-x repeat 0 0;
}
.skinBody2{
background:url(http://stat.ameba.jp/user_images/20121114/23/11derful/17/0f/g/o0800062712286368465.gif) repeat 0 0;
}
.skinBody3{
background:url(http://stat.ameba.jp/user_images/20121114/23/11derful/3f/e1/g/o0800062712286368466.gif) repeat 0 0;
}
.skinFrame{
background:url(http://stat.ameba.jp/user_images/20121114/23/11derful/9a/9f/g/o0800062712286368464.gif) repeat 0 0;
}
/* ▼▼サイドカラムリスト拡大ここから▼▼ */
/*最新の記事*/
.recentEntriesMenu li a:hover{
font-size:160%; /*拡大時の文字大きさ*/
font-weight:bold; /*文字太字*/
}
/*コメント*/
.recentCommentMenu li a:hover{
font-size:160%; /*拡大時の文字大きさ*/
font-weight:bold; /*文字太字*/
}
/*テーマ*/
.themeMenu li a:hover{
font-size:160%; /*拡大時の文字大きさ*/
font-weight:bold; /*文字太字*/
}
/*月別*/
.archiveMenu li a:hover{
font-size:160%; /*拡大時の文字大きさ*/
font-weight:bold; /*文字太字*/
}
/*ブログ読者*/
.readerMenu li a:hover{
font-size:160%; /*拡大時の文字大きさ*/
font-weight:bold; /*文字太字*/
}
/*お気に入りブログ*/
.favoriteMenu li a:hover{
font-size:160%; /*拡大時の文字大きさ*/
font-weight:bold; /*文字太字*/
}
/*ブックマーク*/
.bookmarkMenu li a:hover{
font-size:160%; /*拡大時の文字大きさ*/
font-weight:bold; /*文字太字*/
}
/* ▲▲サイドカラムリスト拡大ここまで▲▲ */
#banbi {
position:fixed ;
right:-165px; /*ウィンドウの右側からマイナス165px動きなさい!って指定です。ようは165px引っ込みなさいって事です。画像の横幅に合わせて変更して下さい。*/
bottom:300px; /*ウィンドウの下から300pxの所に配置。*/
}
#amebaBar{
opacity: 0.40;
filter: alpha(opacity=40);
-ms-filter: alpha(opacity=40);
}
#amebaBar:hover{
opacity: 1.00;
filter: alpha(opacity=100);
-ms-filter: alpha(opacity=100);
}
css↓
/* アメブロヘッダー画像設定 */
.skinHeaderArea{
height:460px;
background-image:url(http://stat.ameba.jp/user_images/20121122/18/11derful/33/42/p/o0408045012297679578.png);
background-repeat:no-repeat;
background-position:center right;
}
body{
background-color:#000033;
background-image:url("http://stat.blogskin.ameba.jp/blogskin_images/20121104/16/b2/6f/p/o0220022811derful1352015838200.png");
background-position:center top;
background-repeat:repeat;
background-attachment:fixed;
}
/* ▼▼背景の影 ここから▼▼ */
/*
div.skinFrame{
width:1100px; /*フレーム横幅*/
background: ;
opacity: 0.90;
filter: alpha(opacity=90);
-ms-filter: alpha(opacity=90);
background-image:url("");
background-position:center top;
background-attachment:scroll;
background-repeat:repeat;
border-left:solid 1px #d3d3d3; /*左縦線*/
border-right:solid 1px #d3d3d3; /*右縦線*/
margin:auto;
padding:auto;
-webkit-box-shadow: 0px 0px 20px 5px #757575;
-moz-box-shadow: 0px 0px 20px 5px #757575;
box-shadow: 0px 0px 20px 5px #757575;
}*/
/* ▲▲背景の影 ここまで▲▲ */
/* skinDescription ブログの説明文字 */
.skinDescriptionArea {
margin: 0px 0 0 300px; /* 左から上右下左 */
}
/* skinTitle ブログタイトル文字 */
.skinTitle,.skinTitle:visited,.skinTitle:hover,.skinTitle:focus{
color:#c0c0c0;
font-weight:bold;
font-size:40px;
text-shadow: -1px -1px 0px #202020, 1px 1px 0px #fff;
}
/* skinDescription ブログの説明文字 */
.skinDescription{
color:#d3d3d3;
font-size:15px;
font-weight:bold;
text-shadow: 1px 1px 0px white;
margin: 0px 0 0 200px; /* 左から上右下左 */}
/* skinTitle ブログタイトル文字 */
.skinTitleArea {
margin: 100px 0 0 150px;/* 左から上右下左 */
}
/*▼▼▼リボン風記事タイトル▼▼▼*/
.skinArticleTitle{
color:#ffffff;
}
.skinArticleHeader{
padding:0px 10px 20px 10px;
margin:0px -31px 0 -31px;
background:transparent;
}
.skinArticleHeader2{
background: #330066; /* Old browsers */
background: #330066;
background: -webkit-gradient(linear, left top, left bottom, from(#330066), to(#a3a1a1));
background: -webkit-linear-gradient(top, #330066, #a3a1a1);
background: -moz-linear-gradient(top, #330066, #a3a1a1);
background: -ms-linear-gradient(top, #330066, #a3a1a1);
background: -o-linear-gradient(top, #330066, #a3a1a1);
background-image: -ms-linear-gradient(top, #330066 0%, #a3a1a1 100%);
-webkit-box-shadow: rgba(000,000,000,0.3) 0 1px 1px;
-moz-box-shadow: rgba(000,000,000,0.3) 0 1px 1px;
color:#ffffff;
text-shadow: #000000 0 1px 0;
box-shadow: rgba(000,000,000,0.3) 0 3px 5px;
position:relative;
}
.skinArticleHeader2:before,
.skinArticleHeader2:after {
content: '';
position: absolute;
right: 0px;
bottom: -20px;
/**/
background:transparent;
border-color: transparent transparent transparent #a1a1a1;
border-style:solid;
border-width:20px;
width: 0;
height: 0;
border-top: 10px solid #333;
border-bottom: 10px solid transparent;
border-left: 10px solid #333;
border-right: 10px solid transparent;
}
.skinArticleHeader2:before {
left: 0px;
bottom: -20px;
right:auto;
width: 0;
height: 0;
border-top: 10px solid #333;
border-bottom: 10px solid transparent;
border-left: 10px solid transparent;
border-right: 10px solid #333;
}
/* ▲▲▲▲▲▲ */
/*記事横幅*/
.columnB .skinMainArea{width:600px;}
/*▼▼▼リボン風サイドタイトル▼▼▼*/
.skinMenuHeader{
padding:5px 10px 5px 10px;
margin:0px -30px 0 -30px;
background:transparent;
}
.skinMenuHeader{
background: #330066; /* Old browsers */
background: -webkit-gradient(linear, left top, left bottom, from(#330066), to(#a3a1a1));
background: -webkit-linear-gradient(top, #330066, #a3a1a1);
background: -moz-linear-gradient(top, #330066, #a3a1a1);
background: -ms-linear-gradient(top, #330066, #a3a1a1);
background: -o-linear-gradient(top, #330066, #a3a1a1);
background-image: -ms-linear-gradient(top, #330066 0%, #a3a1a1 100%);
-webkit-box-shadow: rgba(000,000,000,0.3) 0 1px 1px;
-moz-box-shadow: rgba(000,000,000,0.3) 0 1px 1px;
box-shadow: rgba(000,000,000,0.3) 0 3px 5px;
position:relative;
color: #ffffff;
text-shadow: #000000 0 1px 0;
}
.skinMenuHeader:before,
.skinMenuHeader:after {
content: '';
position: absolute;
right: 0px;
bottom: -20px;
width: 0;
height: 0;
border-top: 10px solid #333;
border-bottom: 10px solid transparent;
border-left: 10px solid #333;
border-right: 10px solid transparent;
}
.skinMenuHeader:before {
left: 0px;
bottom: -20px;
right:auto;
width: 0;
height: 0;
border-top: 10px solid #333;
border-bottom: 10px solid transparent;
border-left: 10px solid transparent;
border-right: 10px solid #333;
}
/* ▲▲▲▲▲▲ */
/* ▼▼プロフ不要削除ここから▼▼ */
/* メッセージを送る */
.profileMenu .profileBtnArea>li:first-child+li+li{display:none;}
/* プレゼントを贈る */
.profileMenu .profileBtnArea>li:first-child+li+li+li{display:none;}
/* アメンバーになる */
/*.profileMenu .profileBtnArea>li:first-child+li{display:none;}*/
/* プロフィール|ピグの部屋のみ */
.profileMenu .profileUserPages{display:none;}
/* ▲▲プロフ不要削除ここまで▲▲ */
/*フッターナビ削除*/
.footerNav{
display:none !important;
}
/*プロフ画像位置中央*/
.skinSubA .userProfileImageArea{margin-left:70px;}
/*プロフネーム*/
.skinSubA .profileUserNicknameArea{margin-left:50px;}
/*プロフ内ボタン位置中央*/
.skinSubArea ul, .skinSubArea li{margin-left:55px;}
/*テーマ位置中央*/
.skinSubArea ul, .skinSubList li{margin-left:0px;}
/*▼▼ブログ画像ボタン非表示▼▼*/
.imagelistLink {display:none!important;}
/*▼▼プロフボタン▼▼*/
.skinImgBtnS {
background:#ffffff;
border:1px solid #dddddd;
box-shadow: 0 1px 0 rgba(255, 255, 255, .2), inset 0 3px 3px rgba(0, 0, 0, .6), inset 0 1px 0 rgba(0, 0, 0, .4);
-moz-border-radius-topright: 20px;
-webkit-border-top-right-radius: 20px;
-khtml-border-radius-topright: 20px;
border-top-right-radius: 20px;
-moz-border-radius-bottomleft: 20px;
-webkit-border-bottom-left-radius: 20px;
-khtml-border-radius-bottomleft: 20px;
border-bottom-left-radius: 20px;
-moz-border-radius-topleft: 20px;
-webkit-border-top-left-radius: 20px;
-khtml-border-radius-topleft: 20px;
border-top-left-radius: 20px;
-moz-border-radius-bottomright: 20px;
-webkit-border-bottom-right-radius: 20px;
-khtml-border-radius-bottomright: 20px;
border-bottom-right-radius: 20px;
}
.skinImgBtnS:hover,.skinImgBtnS:focus{
background:#f7f7f7;
background-image:url(http://stat.ameba.jp/user_images/20121102/13/lucifer-d0v0b/35/6c/p/o0004000412266491362.png);
}
/* ▲▲▲▲▲▲ */
/* ▼▼▼▼メッセージボードの調整▼▼▼▼*/
.skinMessageBoard {
border:none;/*線を消す*/
}
/* ▲▲▲▲▲▲ */
/* ▼▼サイドカラム下ずらし▼▼ */
.columnB .skinSubA {
float: right;
width: 300px;
padding:50px 0 0 0;}
/* ▲▲▲▲▲▲ */
/* ▼▼記事下同じテーマの最新記事▼▼ */
.articleThemeListArea {
background: #ffffff;
margin:52px 0 12px 0px;
padding:10px 8px;
color:#4d4d4d;
text-shadow: #ffffff 0 1px 0;
font-variant: small-caps;
text-align:center;
position:relative;
-webkit-border-radius:4px;
-moz-border-radius:4px;
border-left:1px solid #036;
border-top:1px solid #036;
box-shadow:inset 1px 1px 4px #036;
border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
}
/* ▲▲▲▲▲▲ */
/* ページ送りボタンの << 次へ 、前へ >> 、「次の記事タイトル」 >> ボタン*/
.skinSimpleBtn,.skinSimpleBtn:visited,.skinSimpleBtn:hover,.skinSimpleBtn:focus{
border:1px solid #dddddd;
background:#ffffff;
color:#000000 !important;
box-shadow: 0 1px 0 rgba(255, 255, 255, .2), inset 0 3px 3px rgba(0, 0, 0, .6), inset 0 1px 0 rgba(0, 0, 0, .4);
}
/* ボタンにマウスオーバー */
.skinSimpleBtn:hover,.skinSimpleBtn:focus{
background:#f7f7f7;
background-image:url(http://stat.ameba.jp/user_images/20121102/13/lucifer-d0v0b/35/6c/p/o0004000412266491362.png);
}
/* ▲▲▲▲▲▲ */
/* ▲▲▲▲▲▲ */
/* ▼▼時計数字フォント▼▼ */
.articleTime {
font-family: Georgia,'Palatino Linotype','Monotype Corsiva',Verdana;
font-size: 100%;
color: rgb(78, 69, 74);
font-weight: bold;
text-shadow: 1px 1px 1px rgb(221, 221, 221);
}
/* ▲▲▲▲▲▲ */
.skinBody{
background:url(http://stat.blogskin.ameba.jp/blogskin_images/20121114/23/52/87/j/o0006080011derful1352902785679.jpg) fixed repeat-x repeat 0 0;
}
.skinBody2{
background:url(http://stat.ameba.jp/user_images/20121114/23/11derful/17/0f/g/o0800062712286368465.gif) repeat 0 0;
}
.skinBody3{
background:url(http://stat.ameba.jp/user_images/20121114/23/11derful/3f/e1/g/o0800062712286368466.gif) repeat 0 0;
}
.skinFrame{
background:url(http://stat.ameba.jp/user_images/20121114/23/11derful/9a/9f/g/o0800062712286368464.gif) repeat 0 0;
}
/* ▼▼サイドカラムリスト拡大ここから▼▼ */
/*最新の記事*/
.recentEntriesMenu li a:hover{
font-size:160%; /*拡大時の文字大きさ*/
font-weight:bold; /*文字太字*/
}
/*コメント*/
.recentCommentMenu li a:hover{
font-size:160%; /*拡大時の文字大きさ*/
font-weight:bold; /*文字太字*/
}
/*テーマ*/
.themeMenu li a:hover{
font-size:160%; /*拡大時の文字大きさ*/
font-weight:bold; /*文字太字*/
}
/*月別*/
.archiveMenu li a:hover{
font-size:160%; /*拡大時の文字大きさ*/
font-weight:bold; /*文字太字*/
}
/*ブログ読者*/
.readerMenu li a:hover{
font-size:160%; /*拡大時の文字大きさ*/
font-weight:bold; /*文字太字*/
}
/*お気に入りブログ*/
.favoriteMenu li a:hover{
font-size:160%; /*拡大時の文字大きさ*/
font-weight:bold; /*文字太字*/
}
/*ブックマーク*/
.bookmarkMenu li a:hover{
font-size:160%; /*拡大時の文字大きさ*/
font-weight:bold; /*文字太字*/
}
/* ▲▲サイドカラムリスト拡大ここまで▲▲ */
#banbi {
position:fixed ;
right:-165px; /*ウィンドウの右側からマイナス165px動きなさい!って指定です。ようは165px引っ込みなさいって事です。画像の横幅に合わせて変更して下さい。*/
bottom:300px; /*ウィンドウの下から300pxの所に配置。*/
}
#amebaBar{
opacity: 0.40;
filter: alpha(opacity=40);
-ms-filter: alpha(opacity=40);
}
#amebaBar:hover{
opacity: 1.00;
filter: alpha(opacity=100);
-ms-filter: alpha(opacity=100);
}
フリープラグイン↓~~~~~~~~~~~~~~~~↓
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
var bgsc1 = 0;
var bgsc2 = 0;
var bgsc3 = 0;
var bgsc4 = 0;
setInterval(function(){
bgsc1+= 3;//マイナスは左に、プラスは右に移動します。この例だと右に3pxづつ移動します。
bgsc2 += 3;//マイナスは上に、プラスは下に移動します。この例だと下に3pxづつ移動します。
bgsc3 += 3;
bgsc4 += -3;
$(".skinBody3").css("background-position", bgsc1 + "px " + bgsc2 + "px");
$(".skinFrame").css("background-position", bgsc3 + "px " + bgsc4 + "px");
});
});
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$(function () {
$(window).scroll(function () {
if ($(this).scrollTop() > 200) { //トップから200pxスクロールしたら?
$("#banbi").animate({"right": "20px"}, 100); //#banbiをスライドインして出てきなさい!
} else { //それ以外は?(それ以外とは、ここでは200px以下という事になります。)
$("#banbi").animate({"right": "-165px"}, 100); //#banbiをスライドアウトして隠れなさい!
}
});
});
});
</script>
<a href="#"><img src="http://stat.ameba.jp/user_images/20121116/19/11derful/c8/64/p/o0089014412288698800.png" id="banbi" /></a>
/* アメブロヘッダー画像設定 */
.skinHeaderArea{
height:460px;
background-image:url(http://stat.ameba.jp/user_images/20121122/18/11derful/33/42/p/o0408045012297679578.png);
background-repeat:no-repeat;
background-position:center right;
}
body{
background-color:#000033;
background-image:url("http://stat.blogskin.ameba.jp/blogskin_images/20121104/16/b2/6f/p/o0220022811derful1352015838200.png");
background-position:center top;
background-repeat:repeat;
background-attachment:fixed;
}
/* ▼▼背景の影 ここから▼▼ */
/*
div.skinFrame{
width:1100px; /*フレーム横幅*/
background: ;
opacity: 0.90;
filter: alpha(opacity=90);
-ms-filter: alpha(opacity=90);
background-image:url("");
background-position:center top;
background-attachment:scroll;
background-repeat:repeat;
border-left:solid 1px #d3d3d3; /*左縦線*/
border-right:solid 1px #d3d3d3; /*右縦線*/
margin:auto;
padding:auto;
-webkit-box-shadow: 0px 0px 20px 5px #757575;
-moz-box-shadow: 0px 0px 20px 5px #757575;
box-shadow: 0px 0px 20px 5px #757575;
}*/
/* ▲▲背景の影 ここまで▲▲ */
/* skinDescription ブログの説明文字 */
.skinDescriptionArea {
margin: 0px 0 0 300px; /* 左から上右下左 */
}
/* skinTitle ブログタイトル文字 */
.skinTitle,.skinTitle:visited,.skinTitle:hover,.skinTitle:focus{
color:#c0c0c0;
font-weight:bold;
font-size:40px;
text-shadow: -1px -1px 0px #202020, 1px 1px 0px #fff;
}
/* skinDescription ブログの説明文字 */
.skinDescription{
color:#d3d3d3;
font-size:15px;
font-weight:bold;
text-shadow: 1px 1px 0px white;
margin: 0px 0 0 200px; /* 左から上右下左 */}
/* skinTitle ブログタイトル文字 */
.skinTitleArea {
margin: 100px 0 0 150px;/* 左から上右下左 */
}
/*▼▼▼リボン風記事タイトル▼▼▼*/
.skinArticleTitle{
color:#ffffff;
}
.skinArticleHeader{
padding:0px 10px 20px 10px;
margin:0px -31px 0 -31px;
background:transparent;
}
.skinArticleHeader2{
background: #330066; /* Old browsers */
background: #330066;
background: -webkit-gradient(linear, left top, left bottom, from(#330066), to(#a3a1a1));
background: -webkit-linear-gradient(top, #330066, #a3a1a1);
background: -moz-linear-gradient(top, #330066, #a3a1a1);
background: -ms-linear-gradient(top, #330066, #a3a1a1);
background: -o-linear-gradient(top, #330066, #a3a1a1);
background-image: -ms-linear-gradient(top, #330066 0%, #a3a1a1 100%);
-webkit-box-shadow: rgba(000,000,000,0.3) 0 1px 1px;
-moz-box-shadow: rgba(000,000,000,0.3) 0 1px 1px;
color:#ffffff;
text-shadow: #000000 0 1px 0;
box-shadow: rgba(000,000,000,0.3) 0 3px 5px;
position:relative;
}
.skinArticleHeader2:before,
.skinArticleHeader2:after {
content: '';
position: absolute;
right: 0px;
bottom: -20px;
/**/
background:transparent;
border-color: transparent transparent transparent #a1a1a1;
border-style:solid;
border-width:20px;
width: 0;
height: 0;
border-top: 10px solid #333;
border-bottom: 10px solid transparent;
border-left: 10px solid #333;
border-right: 10px solid transparent;
}
.skinArticleHeader2:before {
left: 0px;
bottom: -20px;
right:auto;
width: 0;
height: 0;
border-top: 10px solid #333;
border-bottom: 10px solid transparent;
border-left: 10px solid transparent;
border-right: 10px solid #333;
}
/* ▲▲▲▲▲▲ */
/*記事横幅*/
.columnB .skinMainArea{width:600px;}
/*▼▼▼リボン風サイドタイトル▼▼▼*/
.skinMenuHeader{
padding:5px 10px 5px 10px;
margin:0px -30px 0 -30px;
background:transparent;
}
.skinMenuHeader{
background: #330066; /* Old browsers */
background: -webkit-gradient(linear, left top, left bottom, from(#330066), to(#a3a1a1));
background: -webkit-linear-gradient(top, #330066, #a3a1a1);
background: -moz-linear-gradient(top, #330066, #a3a1a1);
background: -ms-linear-gradient(top, #330066, #a3a1a1);
background: -o-linear-gradient(top, #330066, #a3a1a1);
background-image: -ms-linear-gradient(top, #330066 0%, #a3a1a1 100%);
-webkit-box-shadow: rgba(000,000,000,0.3) 0 1px 1px;
-moz-box-shadow: rgba(000,000,000,0.3) 0 1px 1px;
box-shadow: rgba(000,000,000,0.3) 0 3px 5px;
position:relative;
color: #ffffff;
text-shadow: #000000 0 1px 0;
}
.skinMenuHeader:before,
.skinMenuHeader:after {
content: '';
position: absolute;
right: 0px;
bottom: -20px;
width: 0;
height: 0;
border-top: 10px solid #333;
border-bottom: 10px solid transparent;
border-left: 10px solid #333;
border-right: 10px solid transparent;
}
.skinMenuHeader:before {
left: 0px;
bottom: -20px;
right:auto;
width: 0;
height: 0;
border-top: 10px solid #333;
border-bottom: 10px solid transparent;
border-left: 10px solid transparent;
border-right: 10px solid #333;
}
/* ▲▲▲▲▲▲ */
/* ▼▼プロフ不要削除ここから▼▼ */
/* メッセージを送る */
.profileMenu .profileBtnArea>li:first-child+li+li{display:none;}
/* プレゼントを贈る */
.profileMenu .profileBtnArea>li:first-child+li+li+li{display:none;}
/* アメンバーになる */
/*.profileMenu .profileBtnArea>li:first-child+li{display:none;}*/
/* プロフィール|ピグの部屋のみ */
.profileMenu .profileUserPages{display:none;}
/* ▲▲プロフ不要削除ここまで▲▲ */
/*フッターナビ削除*/
.footerNav{
display:none !important;
}
/*プロフ画像位置中央*/
.skinSubA .userProfileImageArea{margin-left:70px;}
/*プロフネーム*/
.skinSubA .profileUserNicknameArea{margin-left:50px;}
/*プロフ内ボタン位置中央*/
.skinSubArea ul, .skinSubArea li{margin-left:55px;}
/*テーマ位置中央*/
.skinSubArea ul, .skinSubList li{margin-left:0px;}
/*▼▼ブログ画像ボタン非表示▼▼*/
.imagelistLink {display:none!important;}
/*▼▼プロフボタン▼▼*/
.skinImgBtnS {
background:#ffffff;
border:1px solid #dddddd;
box-shadow: 0 1px 0 rgba(255, 255, 255, .2), inset 0 3px 3px rgba(0, 0, 0, .6), inset 0 1px 0 rgba(0, 0, 0, .4);
-moz-border-radius-topright: 20px;
-webkit-border-top-right-radius: 20px;
-khtml-border-radius-topright: 20px;
border-top-right-radius: 20px;
-moz-border-radius-bottomleft: 20px;
-webkit-border-bottom-left-radius: 20px;
-khtml-border-radius-bottomleft: 20px;
border-bottom-left-radius: 20px;
-moz-border-radius-topleft: 20px;
-webkit-border-top-left-radius: 20px;
-khtml-border-radius-topleft: 20px;
border-top-left-radius: 20px;
-moz-border-radius-bottomright: 20px;
-webkit-border-bottom-right-radius: 20px;
-khtml-border-radius-bottomright: 20px;
border-bottom-right-radius: 20px;
}
.skinImgBtnS:hover,.skinImgBtnS:focus{
background:#f7f7f7;
background-image:url(http://stat.ameba.jp/user_images/20121102/13/lucifer-d0v0b/35/6c/p/o0004000412266491362.png);
}
/* ▲▲▲▲▲▲ */
/* ▼▼▼▼メッセージボードの調整▼▼▼▼*/
.skinMessageBoard {
border:none;/*線を消す*/
}
/* ▲▲▲▲▲▲ */
/* ▼▼サイドカラム下ずらし▼▼ */
.columnB .skinSubA {
float: right;
width: 300px;
padding:50px 0 0 0;}
/* ▲▲▲▲▲▲ */
/* ▼▼記事下同じテーマの最新記事▼▼ */
.articleThemeListArea {
background: #ffffff;
margin:52px 0 12px 0px;
padding:10px 8px;
color:#4d4d4d;
text-shadow: #ffffff 0 1px 0;
font-variant: small-caps;
text-align:center;
position:relative;
-webkit-border-radius:4px;
-moz-border-radius:4px;
border-left:1px solid #036;
border-top:1px solid #036;
box-shadow:inset 1px 1px 4px #036;
border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
}
/* ▲▲▲▲▲▲ */
/* ページ送りボタンの << 次へ 、前へ >> 、「次の記事タイトル」 >> ボタン*/
.skinSimpleBtn,.skinSimpleBtn:visited,.skinSimpleBtn:hover,.skinSimpleBtn:focus{
border:1px solid #dddddd;
background:#ffffff;
color:#000000 !important;
box-shadow: 0 1px 0 rgba(255, 255, 255, .2), inset 0 3px 3px rgba(0, 0, 0, .6), inset 0 1px 0 rgba(0, 0, 0, .4);
}
/* ボタンにマウスオーバー */
.skinSimpleBtn:hover,.skinSimpleBtn:focus{
background:#f7f7f7;
background-image:url(http://stat.ameba.jp/user_images/20121102/13/lucifer-d0v0b/35/6c/p/o0004000412266491362.png);
}
/* ▲▲▲▲▲▲ */
/* ▲▲▲▲▲▲ */
/* ▼▼時計数字フォント▼▼ */
.articleTime {
font-family: Georgia,'Palatino Linotype','Monotype Corsiva',Verdana;
font-size: 100%;
color: rgb(78, 69, 74);
font-weight: bold;
text-shadow: 1px 1px 1px rgb(221, 221, 221);
}
/* ▲▲▲▲▲▲ */
.skinBody{
background:url(http://stat.blogskin.ameba.jp/blogskin_images/20121114/23/52/87/j/o0006080011derful1352902785679.jpg) fixed repeat-x repeat 0 0;
}
.skinBody2{
background:url(http://stat.ameba.jp/user_images/20121114/23/11derful/17/0f/g/o0800062712286368465.gif) repeat 0 0;
}
.skinBody3{
background:url(http://stat.ameba.jp/user_images/20121114/23/11derful/3f/e1/g/o0800062712286368466.gif) repeat 0 0;
}
.skinFrame{
background:url(http://stat.ameba.jp/user_images/20121114/23/11derful/9a/9f/g/o0800062712286368464.gif) repeat 0 0;
}
/* ▼▼サイドカラムリスト拡大ここから▼▼ */
/*最新の記事*/
.recentEntriesMenu li a:hover{
font-size:160%; /*拡大時の文字大きさ*/
font-weight:bold; /*文字太字*/
}
/*コメント*/
.recentCommentMenu li a:hover{
font-size:160%; /*拡大時の文字大きさ*/
font-weight:bold; /*文字太字*/
}
/*テーマ*/
.themeMenu li a:hover{
font-size:160%; /*拡大時の文字大きさ*/
font-weight:bold; /*文字太字*/
}
/*月別*/
.archiveMenu li a:hover{
font-size:160%; /*拡大時の文字大きさ*/
font-weight:bold; /*文字太字*/
}
/*ブログ読者*/
.readerMenu li a:hover{
font-size:160%; /*拡大時の文字大きさ*/
font-weight:bold; /*文字太字*/
}
/*お気に入りブログ*/
.favoriteMenu li a:hover{
font-size:160%; /*拡大時の文字大きさ*/
font-weight:bold; /*文字太字*/
}
/*ブックマーク*/
.bookmarkMenu li a:hover{
font-size:160%; /*拡大時の文字大きさ*/
font-weight:bold; /*文字太字*/
}
/* ▲▲サイドカラムリスト拡大ここまで▲▲ */
#banbi {
position:fixed ;
right:-165px; /*ウィンドウの右側からマイナス165px動きなさい!って指定です。ようは165px引っ込みなさいって事です。画像の横幅に合わせて変更して下さい。*/
bottom:300px; /*ウィンドウの下から300pxの所に配置。*/
}
#amebaBar{
opacity: 0.40;
filter: alpha(opacity=40);
-ms-filter: alpha(opacity=40);
}
#amebaBar:hover{
opacity: 1.00;
filter: alpha(opacity=100);
-ms-filter: alpha(opacity=100);
}
フリープラグイン↓~~~~~~~~~~~~~~~~↓
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
var bgsc1 = 0;
var bgsc2 = 0;
var bgsc3 = 0;
var bgsc4 = 0;
setInterval(function(){
bgsc1+= 3;//マイナスは左に、プラスは右に移動します。この例だと右に3pxづつ移動します。
bgsc2 += 3;//マイナスは上に、プラスは下に移動します。この例だと下に3pxづつ移動します。
bgsc3 += 3;
bgsc4 += -3;
$(".skinBody3").css("background-position", bgsc1 + "px " + bgsc2 + "px");
$(".skinFrame").css("background-position", bgsc3 + "px " + bgsc4 + "px");
});
});
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$(function () {
$(window).scroll(function () {
if ($(this).scrollTop() > 200) { //トップから200pxスクロールしたら?
$("#banbi").animate({"right": "20px"}, 100); //#banbiをスライドインして出てきなさい!
} else { //それ以外は?(それ以外とは、ここでは200px以下という事になります。)
$("#banbi").animate({"right": "-165px"}, 100); //#banbiをスライドアウトして隠れなさい!
}
});
});
});
</script>
<a href="#"><img src="http://stat.ameba.jp/user_images/20121116/19/11derful/c8/64/p/o0089014412288698800.png" id="banbi" /></a>
あああああああああああああああああ