ChatGPTなどのチャットAIがどんな風に文章を認識しているのかが一目で分かる「Tokenizer」

2023/04/06 135 users Tokenizer OpenAI chatgpt OPEN

OpenAIが開発したChatGPTをはじめ、さまざまなAIが人間レベルの会話を行ってくれるようになりました。AIは文章を読み書きするとき「トークン」という単位で認識を行うのですが、普通の文章がトークン的にはどのように分解されるのかを一目で教えてくれるツール「Tokenizer」がOpenAIのページ上で公開されています。 Open... 続きを読む

CSSの最新テクニック！ シンプルなHTMLとCSSで、オフキャンバスのメニューをポップアップで実装

2022/10/25 49 users CSS オフキャンバス 実装 HTML ドロワー

この実装は、完全に想定外の発想でした！ スマホでよく見かけるドロワー、オフキャンバスのメニューをポップアップで実装するCSSの最新テクニックを紹介します。 オフキャンバスも確かにポップアップと同様にページ上に浮かぶように表示されますが、ポップアップで実装できるようになるとは思いませんでした。JavaScript... 続きを読む

CSSでスクロールが連鎖するのを回避する古い方法とoverscroll-behaviorを使った新しいテクニック

2021/11/11 144 users モーダル 終点 連鎖 CSS ナビゲーション

スクロールの連鎖（スクロールチェーン）とは、ページ上にスクロールするコンテンツがあり、そのコンテンツをスクロールして終点に到達するとメインのコンテンツもスクロールしてしまう現象です。 モーダルにスクロールがある場合、スマホのナビゲーションにスクロールがある場合、固定サイドバーにスクロールがある場合... 続きを読む

『怒首領蜂』などのシューティングゲームで知られるケイブが『東方Project』IPの完全新作タイトル製作を発表。2022年リリース予定

2021/07/13 16 users ケイブ シューティングゲーム 怒首領蜂 東方Project

『怒首領蜂』などのシューティングゲームで知られるケイブが『東方Project』IPの完全新作タイトル製作を発表。2022年リリース予定 ケイブは7月13日（火）、投資家向け広報（IR）ページ上でシューティングゲーム『東方Project』のIP許諾を受けた完全新作タイトルを製作すると発表した。本作は2022年にリリース予定だ。タ... 続きを読む

HTMLのhidden属性の使い方と弱点、要素の表示・非表示を切り替える便利なスタイルシート | コリス

2019/10/30 40 users コリス Attribute 弱点 HTML 要素

ページ上の要素、例えばメニューの中身などの表示・非表示を切り替える必要がある時があります。実装方法はいろいろありますが、要素を非表示にする一番簡単な方法はHTMLのhidden属性です。 HTMLのhidden属性の使い方と弱点、要素の表示・非表示を切り替える便利なスタイルシートを紹介します。 The 'hidden' Attribute ... 続きを読む

ページ上のあらゆる要素をドラッグ・リサイズ・スケール・回転・ワープ・グループ化・スナップ操作を可能にする万能JavaScriptライブラリ -Moveable | コリス

2019/10/16 49 users React angular Preact コリス Vue

ページ上のあらゆる要素をドラッグ・リサイズ・スケール・回転・ワープ・グループ化・スナップ操作できるようにするJavaScriptライブラリを紹介します。 単体で利用でき、React, Preact, Angular, Vueにも対応しています。 Moveable -GitHub Moveableの特徴 Moveableのデモ Moveableの使い方 Moveableの特徴 Moveableは... 続きを読む

CSSで実装したレイアウトの構造や階層を簡単に確認できる、私のお気に入りのCSSハック -My favorite CSS hack | コリス

2019/09/10 86 users コリス Grid Flexbox 階層 CSS

flexboxで実装したレイアウトはもちろん、floatでもgridでもCSSで実装したレイアウトの構造や階層を確認できるスタイルシートを紹介します。 ページ上の各要素のサイズ・マージン・パディングなどに不整合がないか簡単に確認でき、スニペットやブックマークレットに登録しておくと便利です。 My favorite CSS hack by Ga... 続きを読む

モーダルを開いている時にページがスクロールしてしまうのを防ぐCSSとJavaScriptのテクニック | コリス

2019/06/18 215 users モーダル コリス CSS テクニック JavaScript

ページ上でモーダルを開き、スクロールして、モーダルを閉じると、通常そのページはモーダルを開いた時とは別の場所にスクロールされた状態で表示されてしまいます。そして、スクロールした状態で、モーダルを開いて閉じると、一番上にスクロールされた状態で表示されてしまいます。 これらを解決するCSSとJavaScriptの... 続きを読む

Wordに全人類待望の“暴れ回るティラノサウルス”表示機能が追加　「虚構かと思った」「退職願に入れたい」 - ねとらぼ

2018/12/09 499 users ティラノサウルス 虚構 word マイクロソフト 退職願

マイクロソフトの「Word for Office 365」の新機能が、あまりにも便利過ぎると一部で話題になっています。“暴れ回るティラノサウルス”をページやスライド上に表示できるというもので、マイクロソフトの公式サイトにもバッチリ書かれています。そうそう、ちょうどページ上でティラノサウルスを暴れ回らせたかったのですよ... 続きを読む

これを使うとスクロールに連動したアニメーションが簡単に！わずか2KBの超軽量JavaScriptライブラリ -Sal.js | コリス

2018/09/12 210 users コリス スクロール スクロールアニメーション アニメーション

スクロールに連動して、ページ上の要素をアニメーションで表示するライブラリはいくつかあります。その中でもかなりの超軽量で、他スクリプトへの依存が一切ないスクロールアニメーションのライブラリを紹介します。 しかも実装は超簡単。手間がかかりそうと思っていた人は、ぜひお試しを。 Sal.js Sal.js -GitHub Sal.j... 続きを読む

サイト上で実行されるプログラムについて同意を確認するためのプログラム – GUNMA GIS GEEK

2018/06/19 119 users GUNMA GIS GEEK 同意 プログラム サイト上 昨今

昨今、クライアントサイドでプログラムを実行するリスクが高まっています。 そこで、ページ上で実行されるプログラムについて閲覧者に同意を求めるプログラムをこのページに埋め込んでみました。 ひとえにクライアントサイドで実行されるプログラムといっても様々なものがあります。 例えばこのブログはWordpressで作ら... 続きを読む

CSSアニメーションもこれなら手軽！DOM要素にマイクロインタラクションを与えるJavaScriptライブラリ -Micron | コリス

2018/01/24 50 users Micron インタラクション コリス CSS ライブラリ

ページ上のさまざまなDOM要素にマイクロインタラクションを簡単に与えることができるJavaScriptのライブラリを紹介します。 実装は非常に簡単、カスタマイズ性にも優れており、CSSで要素をアニメーションさせ、JavaScriptでインタラクティブな動作をコントロールできます。 インタラクションを与える 要素に「data-micron」を加えるだけで、インタラクションを与えることができます。 バ... 続きを読む

ページ上でずっと動いているsetTimeout、setInterval、requestAnimationFrameを見つけてパフォーマンス改善する | Web Scratch

2017/12/07 99 users setInterval setTimeout timer

複雑なウェブアプリケーションになってくると、1つのページで複数のTimerなどを回すことがあります。 例えば、Twitterのようなアプリならば、ポーリングで更新するために setInverval のようなタイマーを回します。 また、ゲームなどCanvasで描画を行うアプリケーションならば、メインループを requestAnimationFrame で回します。 このように色々なタイマー系が一つの... 続きを読む

ウェブページの英単語に単語レベルを指定して日本語訳のルビをつけることが可能なGoogle Chrome拡張機能「Read Ruby」レビュー - GIGAZINE

2017/10/04 73 users 英文 GIGAZINE ルビ ウェブサイト ウェブページ

英文のウェブサイトを読んでいる時に分からない単語が出てくると、いちいちソフトウェアやウェブ検索で意味を調べる必要があり、面倒なもの。そんな中、ページ上の英単語に日本語のルビを振ってくれるGoogle Chrome拡張機能「 Read Ruby 」が公開されています。ルビを振る単語レベルを指定可能なことから、自分の英語レベルで理解できなさそうな単語に絞って意味を表示してくれるという、便利なツールにな... 続きを読む

App Storeが選ぶ「2015年ベストゲーム」が発表！　革新的なゲームを含む25本のアプリが選出 | Social Game Info

2015/12/10 11 users 選出 Social Game Info App Store

Appleは、アプリマーケット「App Store」上において「BEST OF 2015」と題した特設ページを公開した。ページ上では、同社のエディターたちが厳選した2015年を代表する傑作タイトルが紹...Appleは、アプリマーケット「App Store」上において「BEST OF 2015」と題した特設ページを公開した。ページ上では、同社のエディターたちが厳選した2015年を代表する傑作タイト... 続きを読む

Webページを印刷する時に便利！不要な部分を除いたりスタイルを最適化して印刷できる -The Printliminator | コリス

2015/11/18 28 users ブラウザ クリック サイズ 2枚目 1枚

Webページを印刷する時に、うまく収まらず残念な思いをしたことはありませんか？ 縮小したり、紙のサイズを変えたりも手ですが、不要な部分を除いてしまうのも手です。 ページ上の不要な部分をクリックで簡単に削除して、印刷できるブラウザの機能拡張・ブックマークレットを紹介します。 下のように2枚目にちょっとはみ出してしまうのも、すっきり1枚に印刷できますね。 The Printliminator The ... 続きを読む

[JS]レスポンシブ対応、画像の配置を文字のツラにぴったり揃えるスクリプト -Baseline Element | コリス

2015/11/06 95 users 罫線 コリス づら デモ スクリプト

画像やテキストなど、コンテンツのデザインで重要なのは縦のリズム。 ページ上の指定した要素を文字のベースラインにツラをあわせて配置し、縦のリズムを簡単にデザインできるスクリプトを紹介します。 デモのように罫線を背景にした時...記事の続きを読む 続きを読む

debugCSSでCSSをチェックする

2015/07/04 50 users ブックマークレット CSS ブックマーク Blog 結果

27 Jun 2015 Top › Blog › CSS , JavaScript debugCSSでCSSをチェックする B! 0 3 0 0 P 2 debugCSS というブックマークレットが面白かったのでそれについて。 debugCSS Sponsored Links debugCSS debugCSS は表示中のページのCSSをチェックして結果をページ上に表示してくれる ブックマークレッ... 続きを読む

Amazon、家電やPCの取付／修理サービス「Local Services」を開始 - ITmedia ニュース

2014/12/01 23 users 日程 認定 プログラム 決済 地方

ユーザーがAmazonのページ上でサービスに申し込んで日程を決めると、指定した時間にAmazonが認定した業者が来訪してサービスを実施する。他のAmazonのサービス同様、決済はAmazon上で行う。 同社は地方の業者に向けて、「Selling Services on Amazon」（β）プログラムで登録を呼び掛けている。登録は2015年6月までは無料。認定のために50ドル必要だ。Amazonは売... 続きを読む

[JS]非常に簡単な実装で、ページ上のさまざまな要素にオーバーレイを表示できるスクリプト -Purplecoat.js | コリス

2014/11/12 44 users コリス jQuery jquery.js Body Step

画像にオーバーレイでテキストを表示したり、ボタンやテキストなどさまざまな要素にオーバーレイをアニメーションで表示できるjQueryのプラグインを紹介します。 使い方も非常に簡単で、スクリプトを一行も記述しないで利用できます。 デモページ：カスタマイズ Purplecoat.jsの使い方 Step 1: 外部ファイル 当スクリプトとjquery.jsを外部ファイルとして記述します。 <body> .... 続きを読む

Web Design Bookmarks | Webデザインの参考になるトレンドまとめ

2014/07/21 216 users インスピレーション トレンドまとめ ミッション 参考 デザイン

Web Design Bookmarksは、Webデザインの参考になるトレンドまとめサービスです。 サービスのランディングページを中心に掲載しています。 このサービスは、「Webデザイン制作に関わるすべての人に、最高のインスピレーションを与えること」をミッションに制作しました。 そのため、ページ上に余計な情報を表示せず、デザイン閲覧に集中できるようなデザインにしています。 このサービスをとおして、... 続きを読む

Tumblrの省メモリーな無限スクロール - 記録

2014/06/13 538 users tumblr ユーザースクリプト 無限スクロール 記録 画面

無限スクロールまたはauto pagingと呼ばれるUIには、読み終えたコンテンツがどんどん画面の上のほうに溜まっていってメモリーを食い潰すという問題がある。 なかでもTumblrは画像などのコンテンツが多いため、ダッシュボードダイバーたちは無限Tumblrユーザースクリプトなどのユーザースクリプトをインストールして、読み終えたコンテンツを定期的にページ上から自動削除するといった対策を講じていた。... 続きを読む

Adblock PlusアドオンはFifrefoxのメモリ消費量を大幅に増加させている - GIGAZINE

2014/05/15 53 users GIGAZINE ブラウジング Firefoxアドオン 一方

By Pascale PirateChickan ウェブ上の広告を自動的に非表示にしてくれる「Adblock Plus」は、Firefoxアドオンの中で最もインストールされている人気アドオンです。広告を消すことでページの読み込み速度が上がったり、ページ上の不要な要素がなくなったりしてブラウジングが快適になる効果がありますが、一方で、Adblock PlusがFifrefoxのメモリ消費量を大幅に増... 続きを読む

CSSのレイアウトの崩れを見つける時に役立つChromeの機能拡張 -Pesticide | コリス

2014/04/30 150 users コリス CSS Chrome レイアウト ローカル環境

ウェブ制作時の困ったは、CSSのレイアウトが思うようにいかない時。 そんな時に役立つ、ページ上の全ての要素のアウトラインを要素ごとに異なるカラーで表示する便利ツールを紹介します。 PesticideはChromeの機能拡張だけでなく、外部スタイルシートとしても提供されているのでローカル環境でブラウザを問わず利用できます。 Pesticide Pesticide -GitHub Pesticideの... 続きを読む

使いやすいスタイルガイドを作るための5つのポイント - GIGAZINE

2014/04/26 77 users コンポーネント モジュール GIGAZINE デザイナー 5つ

by Dave Crosby ウェブサイトのデザインを決める時にページ上のコンポーネントやモジュールをリスト化したスタイルガイドを作っておくと、開発者や他のデザイナーと情報が共有でき便利です。では、どのようにしてスタイルガイドを使うとうまく運用できるのか？ということで、ZURB Universityが5つのポイントにまとめています。 ZURB University | 3 Minute Lesso... 続きを読む