【SUUMO】サイトで「デベロッパーツール」を使うと【スーモ】に出会えちゃう?!

Technology
スポンサーリンク

みなさんこんにちは!おさかなです!

今回は「【SUUMO】サイトで「デベロッパーツール」を使うと【スーモ】に出会えちゃう?!」について、書いていこうと思います!

それでは、レッツゴー!!!!!

想定読者
・デベロッパーツールの使い方を知りたい方
・ネタサイトで休憩したい方
・スーモくんに会いたい方!

デベロッパーツールに隠されたスーモ?!

おさかな
おさかな

デベロッパーツールを使うとスーモくんに出会えるらしい!笑

ナビまる
ナビまる

何それ!初耳!

おさかな
おさかな

(ナビまる先生、ネタサイトには疎いんだな…。)

【無料】テレビ通話の「背景画像」が見つかる!【Background live】とは?
みなさんこんにちは!おさかなです!今回は「Background live」について、書いていこうと思います!それでは、レッツゴー!!!!!想定読者・ビデオ通話の背景画像が欲しい方・部屋っぽい背景画像を探している方・...

デベロッパーツールとは?

デベロッパーツール」とは、Google Chromeに標準搭載されている開発者用の検証ツール(デバッグツール)で、Webサイトのパフォーマンスを向上させるための多くの機能が搭載されています。

WiLL Cloudより引用

↓デベロッパーツールの使い方を学びたい方はこちら

Chrome Developer Tools入門 (全10回) - プログラミングならドットインストール
Google Chromeに内蔵されているデバッグ用ツールについて学んでいきます。

今回はこれを使って、ちょっと面白い仕掛けのあるサイトを見ていきたいと思います!(おー!)

【SUUMO】不動産売買・住宅購入・賃貸情報ならリクルートの不動産ポータルサイト
【SUUMO(スーモ)】不動産・住宅に関する総合情報サイトです。全国の賃貸情報からマンション・一戸建て・土地などの不動産売買・物件購入情報はもちろん、注文住宅、リフォーム、設備情報に至るまでの豊富な住宅情報で、あなたの幸せな住まい探しをサポートします。
【バーチャル空間】で可愛いネコが「一緒に作業」をしてくれる!?【Coding Cat】とは?【作業用BGM】
みなさんこんにちは!おさかなです!今回は「Coding Cat」について、書いていこうと思います!それでは、レッツゴー!!!!!想定読者・作業用BGMを探している方・ネコと一緒に作業をしたい方・とにかく癒されたい方...

実際につかってみよう!

それでは早速SUUMOのサイトにアクセスします!

PC版を表示する」という風に出てきますが、ボタンは押さずに「スマホ版」のままでOKです!

ここでキーボードの「F12」キーを入力しましょう!(えいやあっ!)

すると…?
このように「デベロッパーツール」が起動します。

次にデベロッパーツールのタブを「Console」に切り替えましょう!(ポチッと!)

すると…?
何やらドット絵のスーモくんが現れました!(わああ!)

(何これかわいい!!!)

コードはこんな感じになっているみたいです!
(時々こういう仕掛けのあるサイトありますよね〜!開発者の遊び心を感じます✨)

JavaScriptが使われていますね〜!!

他のキャラクターも隠れていたら、もっと面白そうですね!(うんうん!)
↓スーモのキャラクター一覧

スーモの部屋 キャラクター|SUUMO(スーモ)
スーモをはじめとしたキャラクターの紹介をしています。

最後にコードコピーして、スーモくん増やしました!(何してんねん…笑)

おさかな
おさかな

たまにはネタサイトで息抜きしよう〜!

これで全ての操作は完了です。(やった~!)
お疲れ様でした☕

ここまで読んでくださり、ありがとうございました!

【Beginners' SQLi】ステージ1の「攻略方法」をわかりやすく解説!
みなさんこんにちは!おさかなです!今回は「Beginners' SQLi」について、書いていこうと思います!それでは、レッツゴー!!!!!想定読者・SQLの学習をしたい方・CTFの問題を解きたい方・SQLを活用した...
おさかな

文章が書けちゃう、新種のおさかなです。

元不登校。引っ越し以外の理由で3回も転校したのに、結局中卒。
現在はマイペースに「プログラム」書いたり、「作曲」したり「文章」書いたり色々してます。
SAOのユウキが好きです!

おさかなをフォローする

この記事は役に立ちましたか?

タイトルとURLをコピーしました