はてなキーワード: :hoverとは
はてなブックマークの増田一覧の、さらに「すべて」(1 user)をチェックしている希有な人向けのユーザースクリプトを公開します。
https://b.hatena.ne.jp/site/anond.hatelabo.jp/?sort=eid
// ==UserScript== // @name Hatena Bookmark Anond Filter // @namespace https://b.hatena.ne.jp/site/anond.hatelabo.jp/ // @description はてなブックマークの『はてな匿名ダイアリー』の記事のうち、指定したNGワードが含まれる投稿を非表示にします。 // @match https://b.hatena.ne.jp/site/anond.hatelabo.jp/* // @grant none // @version 2.1.2026.04.29.0027 // ==/UserScript== /* 2.1.2026.03.25.0023 正規表現に対応。10 users 以上の人気記事を除外判定。 2.0.2026.01.28.0015 ポイント制を導入。 1.0.2025.12.09.0000 公開。 **/ (function(){ const SCRIPTID = 'HatenaBookmarkAnondFilter'; console.time(SCRIPTID); const FILTERED = 'filtered';/* フィルタ該当要素クラス */ const CHECKED = 'checked';/* 二重チェック回避フラグ */ const USERS = 10;/* 人気記事なら誤検知やスパム解説などの可能性があるので除外する */ const POPULAR = 'popular';/* 人気記事クラス */ const ONCE = 1, AP = 2, INTERVAL = 3;/* 適用タイミング */ const NGWORDS = {/* 合計100ポイントで非表示判定(ただし1つの記事内で同じワードが複数使われても1度しか加算しない) */ '100': [/* 即NG確定ワード */ 'dorawii', 'あおやまちゃん', 'アオヤマチャン', 'ボスマン', '大学たいてい', 'なんぴょん', 'れめくん', 'れめきゅん', 'えめくん', 'るまさん', 'るまおねえちゃん', '眠りの民', 'リュックサック野郎', 'boushi_inst', 'hakaikami', 'Rekyu', 'iloveootaku_2', 'osaka-sirokichi',/* 電気通信大学たいてい鉄道研究会れめくん(頻出) */ /*A-G*/'a9w8ru6fqyxqfv9', 'admirail_togo', 'akibakko6348', 'alf1974al', 'amatukiseiru', 'anapgoeson', 'aoi_mizuho', 'asapgoeson', 'asupgo', 'asupgoeson', 'avoid_bds_kk', 'b6jbpsji91ieigt', 'bmi22yo', 'boushi_instrail', 'boushi_ob', 'buscholarx', 'bw0531', 'chihiro_love415', 'circlecavok', 'disney1007cla', 'dora22sibuya', 'donkotrain', 'ecotosk', 'electlone', 'factomodachi', 'fft_dareka', 'gmhtcyznf_abc', 'goesonanap', 'gyudon_honmono', /*H-N*/'h13_yokohama', 'h2twi', 'H2TWR', 'hamaishogo1111', 'haru_mofumoffu', 'hermitv8', 'hide1798038', 'hirabiscus', 'hinolovelove', 'hnmk0127_03', 'inaken17_', 'inte235dy', 'ixtabes', 'jamcombatge', 'kawachiasukanew', 'kaoru_ai1991', 'keio9730F', 'kiha2228', 'kihatena200', 'koreanlabsfc', 'koyounoyooko', 'kqlex1500', 'kunugiyamaosake', 'kurakamasan', 'kurotamaxxx', 'kt_ruma_1372', 'kt_up_date', 'lightningreen77', 'luckyyusha', 'mamadoll_kun', 'matya_uec', 'michee_n', 'minamihinawot', 'miniminicot', 'minori0151', 'mizunyanpanda', 'monkichi_22', 'mugen_08i', 'mukoroku651', 'nakano6409', 'nanpyong', 'new_oer', 'nimouec', 'NoName_thUFO', 'norannnde', /*O-U*/'oreizmmiporin', 'orenotanoshimi', 'osaka_sirokichi', 'papepoco', 'pasotokon', 'pm95uq', 'portrail', 'reme_kun', 'ruin_2002', 'rx00shiratama03', 's03_amurtk2731', 'sacchan03110319', 'sacchanenjoy', 'seishinyamate_', 'seisu_bot', 'senanana_cos', 'shinano_115', 'shineleaf1372', 'Shirasagi494', 'shop_bullet', 'shurimpy', 'soroisoroi', 'sui_pm95uq', 'sweidan821858', 'taiyaki_level2', 'takao_straight5', 'taking0000', 'tarotaromusic1', 'tc201_501', 'thomas_returnee', 'tocarbarn', 'tokusatsu_fan_0', 'toshikimiyazaki', 'train_magician', 'tx9y2cpwdz27255', 'u2fap5u4zw57811', 'uec15take', 'uecdaisuki', 'UECert', 'uecrail', /*V-Z_0-9*/'vampire_mio', 'vbdmnwefknmxsdm', 'vp20th', 'wafue', 'wakasato_', 'walkingniwatori', 'wataameexpress', 'ya4975349616894', 'yayoiulc', 'ymbk_arisa', 'yms_uec16', 'yorozun', 'yuuya_1104_uec', '__________ob', '_chocorail_', '_doitforthewin_', '_toeshin', '_unigmo', '100mph_no_yuuki', '16887y', '169_D51_protect', '205musashino', '2969364x', '2rtkvn34il2783', '36kyo', '86lilxw1', /(?!(.)\1{19,})(.{20,})\2{2}/,/* 20文字以上の文を3回以上繰り返す */ /(?!(.)\1{29,})(.{30,})\2{1}/,/* 30文字以上の文を2回以上繰り返す */ /(?!(.)\1{79,})(.{80,}).*\2/,/* 80文字以上の文が2回以上現れる */ 'テクウヨ', '自己放尿', ' ーーーーーーーー', 'https://anond.hatelabo.jp/20260107144223',/* AI問答貼り付け増田 */ '†噛み締めて行こうな†', 'https://anond.hatelabo.jp/20250826121213#', '困難女性(コンジョ)', '困難女性(コンジョ)', 'コンジョ自警団', 'Boost', 'Cash', 'Coin Master', 'Dice', 'Free', 'Gift', 'Guide', 'Follower', 'Generator',/*英文スパム*/ ], '90': [/* ほぼNG */ 'megalodon.jp', 'tadaup.jp', '鉄道研究会', '鉄研', '通勤特快', '不正乗車', 'こども料金', '性慾', '穢い', 'エッタ', 'オソソ', 'キセル', 'uec', ], '10': [/* NG */ '電気通信大学', '電通大', '駿河台大学', '武蔵野美術大学', '武蔵美', '大学院', '学生課', '教務課', '朝鮮', '統合失調症', ], }; const sites = { 'prefix': [ ['selector', '(modifier)', '(css)', '(REPEAT)'], ], 'https://b.hatena.ne.jp/site/anond.hatelabo.jp/': [ ['section.entrylist-unit li.js-keyboard-selectable-item', li => { if(parseInt(li.querySelector('span.entrylist-contents-users > a > span').textContent) > USERS) li.classList.add(POPULAR); else li.querySelector('li.entrylist-contents-category > a').textContent = li.dataset.matches; }, `.${FILTERED}:not(.${POPULAR}){display: none;}`, AP], ], }; const rules = sites[Object.keys(sites).find(prefix => location.href.startsWith(prefix))]; if(rules === undefined) return console.log(SCRIPTID, 'Not found any sites.'); const scores = Object.keys(NGWORDS).map(Number).reverse();/* 数値インデックス順に取り出されたkeysを逆順にして100から並べ直す */ const filter = function(selector, modifier){/* 各要素に対してNGワード判定して、該当したら追加でmodifierも適用する */ document.querySelectorAll(selector).forEach(e => { if(e.dataset[CHECKED]) return; e.dataset[CHECKED] = 'true'; const text = e.textContent.toLowerCase(); let total = 0, matches = []; for(const score of scores){ for(const word of NGWORDS[String(score)]){ switch(true){ case(typeof word === 'string' && text.includes(word.toLowerCase())): case(word instanceof RegExp && word.test(text)): total += score; matches.push(word); if(total >= 100){ e.classList.add(FILTERED); e.dataset.matches = matches.join(', '); if(modifier) modifier(e); return; } break; } } } }); }; /* ONCE(一括適用) */ rules.forEach(rule => { const [selector, modifier, css] = rule; console.log(SCRIPTID, 'ONCE:', selector); filter(selector, modifier); if(css){ const style = document.createElement('style'); style.dataset.script = SCRIPTID; style.type = 'text/css'; style.textContent = css; document.head.appendChild(style); } }); /* AP(AutoPagerize) */ rules.filter(rule => rule[3] === AP).forEach(rule => { const [selector, modifier] = rule; document.addEventListener('GM_AutoPagerizeNextPageLoaded', e => { console.log(SCRIPTID, 'AP:', selector); filter(selector, modifier); }); }); /* INTERVAL */ rules.filter(rule => rule[3] === INTERVAL).forEach(rule => { const [selector, modifier] = rule; setInterval(function(){ console.log(SCRIPTID, 'INTERVAL:', selector); filter(selector, modifier); }, 1000); }); console.timeEnd(SCRIPTID); })();
/* Hatena Bookmark Anond Filter */ .filtered:not(.popular){ display: block !important;/*上書き*/ opacity: .25 !important; } .filtered:not(.popular):hover{ opacity: .75 !important; } .filtered:not(.popular) li.entrylist-contents-category{ background: red !important; font-weight: bold; }
検索用: はてなブックマーク はてブ はてな匿名ダイアリー 増田 スパム 荒らし キーワード NGワード フィルター ミュート 非表示 削除 隠す ブロック 対策 ユーザースクリプト ユーザースタイル hatena bookmark anond spam keywords ngwords filter mute hide hidden display none block userscript JavaScript js css style
/* 単にアイコンを非表示にするバージョン */ img[src^="https://cdn.profile-image.st-hatena.com/users/"]{ visibility: hidden; } /* マウスを乗せた時だけ表示させるバージョン */ img[src^="https://cdn.profile-image.st-hatena.com/users/"]:not(:hover){ opacity: 0; }
空白を残すより、替わりにデフォルトアイコンを表示させるほうがいいと思ったけど、デフォルトアイコン単体の画像URLが見つからなかったのでやめた。プロフィールのデフォルト画像を変更しました の記事の画像を部分指定して上乗せすればできるけど、コードが煩雑になるよなぁ。あと、余白として残さず存在を無くしてしまう方法(display: none;)は、どこかでレイアウトが崩れるかもしれないので避けた。
<html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>PONG Game</title> <style> body { margin: 0; padding: 0; background-color: #000; display: flex; justify-content: center; align-items: center; min-height: 100vh; font-family: 'Courier New', monospace; color: white; } ``` .game-container { text-align: center; } canvas { border: 2px solid white; background-color: #000; } .score { font-size: 24px; margin: 20px 0; letter-spacing: 2px; } .controls { margin-top: 20px; font-size: 14px; opacity: 0.8; } .start-button { background-color: #333; color: white; border: 2px solid white; padding: 10px 20px; font-size: 16px; cursor: pointer; font-family: 'Courier New', monospace; margin: 10px; } .start-button:hover { background-color: white; color: black; } </style> ``` </head> <body> ``` <script> // Canvas要素とコンテキストの取得 const canvas = document.getElementById('gameCanvas'); const ctx = canvas.getContext('2d'); // ゲームの状態管理 let gameRunning = false; let animationId; // スコア要素の取得 const playerScoreElement = document.getElementById('playerScore'); const computerScoreElement = document.getElementById('computerScore'); // ゲームオブジェクトの定義 const game = { // プレイヤーのパドル(左側) playerPaddle: { x: 10, y: canvas.height / 2 - 50, width: 10, height: 100, speed: 5, upPressed: false, downPressed: false }, // コンピューターのパドル(右側) computerPaddle: { x: canvas.width - 20, y: canvas.height / 2 - 50, width: 10, height: 100, speed: 3.5, // プレイヤーより少し遅く設定 targetY: canvas.height / 2 - 50 }, // ボールの設定 ball: { x: canvas.width / 2, y: canvas.height / 2, radius: 8, speedX: 4, speedY: 3, maxSpeed: 8 }, // スコアの管理 score: { player: 0, computer: 0 } }; // キーボード入力の処理 const keys = {}; // キーが押されたときの処理 document.addEventListener('keydown', (e) => { keys[e.key.toLowerCase()] = true; // ゲームが停止中にスペースキーでゲーム開始 if (e.key === ' ' && !gameRunning) { startGame(); } }); // キーが離されたときの処理 document.addEventListener('keyup', (e) => { keys[e.key.toLowerCase()] = false; }); // パドルの移動処理 function updatePaddles() { // プレイヤーパドルの移動(W/S キーまたは矢印キー) if (keys['w'] || keys['arrowup']) { game.playerPaddle.y -= game.playerPaddle.speed; } if (keys['s'] || keys['arrowdown']) { game.playerPaddle.y += game.playerPaddle.speed; } // プレイヤーパドルの画面外移動を防ぐ if (game.playerPaddle.y < 0) { game.playerPaddle.y = 0; } if (game.playerPaddle.y > canvas.height - game.playerPaddle.height) { game.playerPaddle.y = canvas.height - game.playerPaddle.height; } // コンピューターパドルのAI処理 // ボールの位置を追跡するが、完璧ではない動きを実装 const ballCenterY = game.ball.y; const paddleCenterY = game.computerPaddle.y + game.computerPaddle.height / 2; // ボールとパドルの中心の差を計算 const difference = ballCenterY - paddleCenterY; // 反応に少し遅れを持たせる(人間らしい動き) if (Math.abs(difference) > 10) { if (difference > 0) { game.computerPaddle.y += game.computerPaddle.speed; } else { game.computerPaddle.y -= game.computerPaddle.speed; } } // コンピューターパドルの画面外移動を防ぐ if (game.computerPaddle.y < 0) { game.computerPaddle.y = 0; } if (game.computerPaddle.y > canvas.height - game.computerPaddle.height) { game.computerPaddle.y = canvas.height - game.computerPaddle.height; } } // ボールの移動と衝突判定 function updateBall() { // ボールの位置を更新 game.ball.x += game.ball.speedX; game.ball.y += game.ball.speedY; // 上下の壁との衝突判定 if (game.ball.y - game.ball.radius < 0 || game.ball.y + game.ball.radius > canvas.height) { game.ball.speedY = -game.ball.speedY; } // プレイヤーパドルとの衝突判定 if (game.ball.x - game.ball.radius < game.playerPaddle.x + game.playerPaddle.width && game.ball.x + game.ball.radius > game.playerPaddle.x && game.ball.y + game.ball.radius > game.playerPaddle.y && game.ball.y - game.ball.radius < game.playerPaddle.y + game.playerPaddle.height) { // ボールがパドルに当たった位置によって跳ね返り角度を調整 const hitPos = (game.ball.y - (game.playerPaddle.y + game.playerPaddle.height / 2)) / (game.playerPaddle.height / 2); game.ball.speedX = Math.abs(game.ball.speedX); game.ball.speedY = hitPos * 4; // ボールの速度を少し上げる(ゲームをエキサイティングに) if (Math.abs(game.ball.speedX) < game.ball.maxSpeed) { game.ball.speedX *= 1.02; } } // コンピューターパドルとの衝突判定 if (game.ball.x + game.ball.radius > game.computerPaddle.x && game.ball.x - game.ball.radius < game.computerPaddle.x + game.computerPaddle.width && game.ball.y + game.ball.radius > game.computerPaddle.y && game.ball.y - game.ball.radius < game.computerPaddle.y + game.computerPaddle.height) { // ボールがパドルに当たった位置によって跳ね返り角度を調整 const hitPos = (game.ball.y - (game.computerPaddle.y + game.computerPaddle.height / 2)) / (game.computerPaddle.height / 2); game.ball.speedX = -Math.abs(game.ball.speedX); game.ball.speedY = hitPos * 4; // ボールの速度を少し上げる if (Math.abs(game.ball.speedX) < game.ball.maxSpeed) { game.ball.speedX *= 1.02; } } // ボールが左右の壁を越えた場合(得点処理) if (game.ball.x < 0) { // コンピューターの得点 game.score.computer++; updateScore(); resetBall(); } else if (game.ball.x > canvas.width) { // プレイヤーの得点 game.score.player++; updateScore(); resetBall(); } } // ボールをリセット(得点後の処理) function resetBall() { game.ball.x = canvas.width / 2; game.ball.y = canvas.height / 2; // ランダムな方向でボールを発射 game.ball.speedX = (Math.random() > 0.5 ? 4 : -4); game.ball.speedY = (Math.random() - 0.5) * 6; } // スコア表示の更新 function updateScore() { playerScoreElement.textContent = game.score.player; computerScoreElement.textContent = game.score.computer; } // 描画処理 function draw() { // 画面をクリア ctx.fillStyle = '#000'; ctx.fillRect(0, 0, canvas.width, canvas.height); // 中央の点線を描画 ctx.setLineDash([5, 5]); ctx.beginPath(); ctx.moveTo(canvas.width / 2, 0); ctx.lineTo(canvas.width / 2, canvas.height); ctx.strokeStyle = '#fff'; ctx.stroke(); ctx.setLineDash([]); // プレイヤーパドルを描画 ctx.fillStyle = '#fff'; ctx.fillRect(game.playerPaddle.x, game.playerPaddle.y, game.playerPaddle.width, game.playerPaddle.height); // コンピューターパドルを描画 ctx.fillRect(game.computerPaddle.x, game.computerPaddle.y, game.computerPaddle.width, game.computerPaddle.height); // ボールを描画 ctx.beginPath(); ctx.arc(game.ball.x, game.ball.y, game.ball.radius, 0, Math.PI * 2); ctx.fillStyle = '#fff'; ctx.fill(); // ゲームが停止中の場合、メッセージを表示 if (!gameRunning) { ctx.fillStyle = '#fff'; ctx.font = '20px Courier New'; ctx.textAlign = 'center'; ctx.fillText('ゲーム開始ボタンを押してください', canvas.width / 2, canvas.height / 2 + 60); } } // ゲームのメインループ function gameLoop() { if (!gameRunning) return; updatePaddles(); updateBall(); draw(); animationId = requestAnimationFrame(gameLoop); } // ゲーム開始 function startGame() { gameRunning = true; gameLoop(); } // ゲームリセット function resetGame() { gameRunning = false; if (animationId) { cancelAnimationFrame(animationId); } // スコアをリセット game.score.player = 0; game.score.computer = 0; updateScore(); // ボールとパドルの位置をリセット game.ball.x = canvas.width / 2; game.ball.y = canvas.height / 2; game.ball.speedX = 4; game.ball.speedY = 3; game.playerPaddle.y = canvas.height / 2 - 50; game.computerPaddle.y = canvas.height / 2 - 50; draw(); } // 初期描画 draw(); </script> ``` </body> </html>
動画の上部にあるグラデーション部分にマウスを乗せたときだけ、サムネが見られるようにしている。
(他とも干渉してるかもしれないので、以下でそのまま動くかはわからん)
/* 上部マウスホバーでサムネイル表示 */ #movie_player .ytp-gradient-top{ display: block !important; opacity: 0; pointer-events: auto; } #movie_player.paused-mode:hover .ytp-gradient-top{ opacity: 1; } #movie_player:not(.unstarted-mode) .ytp-gradient-top ~ .ytp-cued-thumbnail-overlay{ display: block !important; opacity: 0; pointer-events: none; } #movie_player .ytp-gradient-top:hover ~ .ytp-cued-thumbnail-overlay{ opacity: 1; z-index: 999; } #movie_player:not(.unstarted-mode:hover) .ytp-gradient-top ~ .ytp-cued-thumbnail-overlay button.ytp-large-play-button{ opacity: 0; }
パソコン画面右上のアイコンで選ぶ表示スタイルを一番右の「ヘッドライン」表示にしといてな
/* ヘッドライン表示を切り詰める */ /* #container 指定でCSS優先度を上げる必要がある */ body[data-entrylist-layout="headline"] #container .entrylist-main{ padding-right: 0 !important; } body[data-entrylist-layout="headline"] #container .entrylist-contents{ padding-left: 0 !important; } body[data-entrylist-layout="headline"] #container .entrylist-contents-users{ position: static !important; } body[data-entrylist-layout="headline"] #container .entrylist-contents-users{ top: 14px !important; } /* ヘッドライン表示にサムネイルを追加 */ body[data-entrylist-layout="headline"] #container .entrylist-contents-main{ display: grid; grid-template: "users body title" 28px "bookmark body domain" 20px / 60px 120px 1fr; } body[data-entrylist-layout="headline"] #container .entrylist-contents-users{ grid-area: users; } body[data-entrylist-layout="headline"] #container .entrylist-contents-users a span{ margin-right: 0; } body[data-entrylist-layout="headline"] #container .following-bookmarks-container{ grid-area: bookmark; position: absolute; left: 20px; bottom: 2.5px; } body[data-entrylist-layout="headline"] #container .entrylist-contents-body{ grid-area: body; } body[data-entrylist-layout="headline"] #container .entrylist-contents-title{ grid-area: title; z-index: 99; } body[data-entrylist-layout="headline"] #container .entrylist-contents-title > a{ margin-left: -120px; padding-left: 120px; margin-bottom: -28px; padding-bottom: 28px; width: 890px; white-space: nowrap; display: block; } body[data-entrylist-layout="headline"] #container .entrylist-contents-body{ display: block !important; } body[data-entrylist-layout="headline"] #container .entrylist-contents-thumb{ position: static; } body[data-entrylist-layout="headline"] #container .entrylist-contents-thumb span{ width: 100px; height: 50px; } body[data-entrylist-layout="headline"] #container .entrylist-contents-thumb{ background: #f0f0f0; width: 100px; height: 50px; background-position: 50%; background-size: cover; border-radius: 4px; } /* 2行目に、総合ではドメイン(domain), サイト内一覧ではカテゴリと時刻(meta), マウスホバー時はいずれも概要文(description) */ body[data-entrylist-layout="headline"] #container .entrylist-contents-domain, body[data-entrylist-layout="headline"] #container .entrylist-contents-meta, body[data-entrylist-layout="headline"] #container .entrylist-contents-description{ grid-area: domain; display: block; opacity: 0; padding: 0 !important; } body[data-entrylist-layout="headline"] #container .entrylist-contents-meta > li{ vertical-align: top; } html[data-stable-request-url^="https://b.hatena.ne.jp/entrylist/"] body[data-entrylist-layout="headline"] #container .entrylist-contents-domain, html[data-stable-request-url^="https://b.hatena.ne.jp/site/"] body[data-entrylist-layout="headline"] #container .entrylist-contents-meta{ opacity: 1; } body[data-entrylist-layout="headline"] #container .entrylist-contents:hover .entrylist-contents-domain img.favicon + span, body[data-entrylist-layout="headline"] #container .entrylist-contents:hover .entrylist-contents-meta{ opacity: 0; } body[data-entrylist-layout="headline"] #container .entrylist-contents-description{ opacity: 0; position: absolute; top: calc(40px - 3px); left: calc(180px + 16px + .5em); height: 20px; line-height: 20px; color: #999; min-height: auto !important; padding-right: 0 !important; width: 890px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } html[data-stable-request-url^="https://b.hatena.ne.jp/site/"] body[data-entrylist-layout="headline"] #container .entrylist-contents:hover .entrylist-contents-domain, body[data-entrylist-layout="headline"] #container .entrylist-contents:hover .entrylist-contents-description{ opacity: 1; } /* 増田調整 */ body[data-entrylist-layout="headline"] #container a[href^="/entry/s/anond.hatelabo.jp/"] .entrylist-contents-thumb{ background-image: url('https://cdn-ak-scissors.b.st-hatena.com/image/square/b1638cdb5807a4788e4ba3c1109a984166e095fc/height=288;version=1;width=512/https%3A%2F%2Fanond.hatelabo.jp%2Fimages%2Fog-image-1500.gif'); } /* マウスホバー時にサムネも反応させる見た目調整 */ .entrylist-contents-title:hover ~ .entrylist-contents-body .entrylist-contents-thumb{ opacity: .90; }
某なんとかパン的なのとか、増田のツリーが大きくなりすぎると見づらくなるのをどうにかしたいなと思ってブラウザアドオンのカスタムCSSをいじってるんだけどなんか微妙…。
本当はクリックでツリー展開したかったんだけど無理そうだからホバーにしたとか、本当は子要素にulを持つliに印を付けたかったけどできなかったとか、いろいろ至らぬ点が重なって気に食わない。
やっぱりCSSだけじゃダメなのかなあ。はてなには天才CSS屋さんとかいそうなので、なにかいい方法あったらおせーて。
(>とか化けちゃうけど下に自分の置いときます。ド素人かつ適当なんで統一感なくてすいません)
li ul li {
display: none;
}
div.refererlist ul li:hover > ul li {
display: block;
}
div.refererlist > ul > li > ul > li:first-child {
display: block;
}
★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★
★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★
_________________ここから下は古い情報▼__________________________________________________
今、自分のブログをスクラッチしているので、こちらで。→2008/9/28 スクラッチ完了!BLACK-OUT.CSS公式ページ
作りました
要は、LynxのようなシンプルWebに世界がなればいいのになと思っている方。
そして、どんなサイトでも目線は左右に動かしたくない!スクロールは上下だけで済ませたい!
と、強く考えておられる方むけの情報です。
私はテキストブラウザのLynxを時々使っているのですが、これでサイトを見るとシンプルに見れるのですごく良いんですよね。
ただ、LynxはFlashとか画像が見れないし、マウスが使えないのはいざって時にちょっと不便。
で、Firefoxをテキストブラウザ化できないかなあと、ふと思いまして、思いつきで作ってしまいました。
私めもwebデザイナーやっとるんですが、上記のように、昨今のwebデザインなんて普段はなくていいって思っている奴でして。
仕事じゃ3カラムのサイトとか作りますが自分はそんなん好きじゃないです。色がサイトごとに違うってのも理解できない。
必要なのは情報であってデザイナーのデザインなんてどうでもいいんですよ。
そんな訳で、どんなサイトでもテキストブラウザ状態で閲覧できるFirefox用の拡張cssを作りました(やっつけだけど)。
ただ、ニュースサイトで画像が見れないと困る時もあるので、普段は小さなサムネイルで、カーソルを合わせた時だけ大きく表示されるようにしています。
@このcssはコンセプト実証モデルです。思いつきで作ってるのでちょっと問題もあります。フィードバックとか意見など頂けると嬉しいかも。
@将来的には、グリモンでjsも組み合わせてもっとコンソールのような感覚でブラウジングできるようにしたい
@(参考用)私のよく見るサイト・・・ニコ動、wikipedia、スラッシュドットジャパン、2nn.jp(2ch)、mixi、はてなでホッテントリに上がっているブログ各種
ちなみに、こんなん使うな、既にこんないいのあるわいってのをご存知の方は教えてくれると嬉しいです。
それなりに探したのだけど、見当たらなくて・・・だから自作したので。
/* * ---------------------------- * black-out.css * author zamamin.com * build 2008.8.09 15:03 * version 0.0.31 * fix @namespaceを書いてなかったので追加 * ---------------------------- * */ @namespace url(http://www.w3.org/1999/xhtml); /* 全てのエレメントをリセット */ body,body * { background-image:none !important; background-color:#000 !important; border-color:#333 !important; text-decoration:none !important; color:#aaa !important; /*<- テキスト色 */ font-size:16px !important; /*<- 文字サイズ */ font-weight:normal !important; padding:0.15em !important; margin:0 !important; line-height:1.25em !important; text-align:left !important; text-indent:0 !important; font-family:Arial,Helvetica,Verdana,'ヒラギノ角ゴPro W3','Hiragino Kaku Gothic Pro',Osaka,'メイリオ',Meiryo,'MS Pゴシック',sans-serif !important; float:none !important; clear:both !important; position:relative !important; width:auto !important; height:auto !important; } body { background-color:#000 !important; padding:0.5em !important; } body * p, body * div, body * h1, body * h2, body * h3, body * h4, body * h5, body * h6{ margin-bottom:0.3em !important; float:left !important; clear:both !important; } /* リンク色 */ body * a, body * a *{ color:#a50 !important; } /* アクセス済みのリンク色 */ body * a:visited{ color:#a50 !important; } /* カーソルを合わせた時のリンク色 */ body * a:hover, body * a:hover *{ color:#0aa !important; background-color:#609 !important; } /* 画像は普段は小さくサムネイル表示。鬱陶しいので薄く表示 */ body * img{ opacity:0.3 !important; height:15px !important; width:15px !important; } /* 画像はマウスカーソルもっていけば原寸サイズになる */ body * img:hover{ opacity:0.9 !important; height:auto !important; width:auto !important; } button, input, select, option, textarea{ color:#f00 !important; padding:0.05em !important; height:auto !important; } /* テーブルのスタイル */ table{ border:none; } table td, table th{ border:none; border-right:1px dashed #999 !important; border-bottom:1px dashed #999 !important; } /* for 2ch(暫定) */ body * dt{ font-weight:bold !important; } /* 二コ動 */ embed#flvplayer{ height:540px !important; width:952px !important; }
インスパイヤ元 - http://anond.hatelabo.jp/20080219145538
@-moz-document domain("b.hatena.ne.jp") { ul#bookmarked_user{ font-size: 105%; } #bookmarked_user li{ list-style-type: decimal; } #bookmarked_user li:before{ content: '\FF1A'; } #bookmarked_user .timestamp:before{ content: '\756A\7D44\306E\9014\4E2D\3067\3059\304C\306F\3066\306A\3067\3059\FF1A '; font-size: 110%; font-weight: bold; color: #008000; } #bookmarked_user img.hatena-id-icon, #bookmarked_user .user-tag, #bookmarked_user .hatena-star-comment-container, #bookmarked_user .hatena-star-star-container{ display: none; } #bookmarked_user a[href*='bookmark-']:before{ content: 'ID:'; } #bookmarked_user a[href*='bookmark-']:link, #bookmarked_user a[href*='bookmark-']:hover{ color: black; text-decoration: none; } #bookmarked_user a[href*='bookmark-']:hover{ color: blue; text-decoration: underline; } #bookmarked_user span.comment{ display: block; padding: 8px 1em; margin-left: 1.5em; } }
曜日の表記と「2008年02月19日」を「2008/02/19」にしたかったが、方法が分からなかった。あ、あと投稿時間も。Greasemonkey じゃないと無理か?
転載・改変は自由なので、再利用したいとかここを変えた方がより良い、という方は好きに使って結構です。
→ はてブちゃんねる