質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

TypeScript

TypeScriptは、マイクロソフトによって開発された フリーでオープンソースのプログラミング言語です。 TypeScriptは、JavaScriptの構文の拡張であるので、既存の JavaScriptのコードにわずかな修正を加えれば動作します。

Q&A

解決済

3回答

3365閲覧

画面内にあるかどうか判別

SaharaDesert

総合スコア16

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

TypeScript

TypeScriptは、マイクロソフトによって開発された フリーでオープンソースのプログラミング言語です。 TypeScriptは、JavaScriptの構文の拡張であるので、既存の JavaScriptのコードにわずかな修正を加えれば動作します。

0グッド

0クリップ

投稿2018/11/20 06:52

編集2018/11/20 07:18

今、JavaScriptで開発している初心者です。
画像を生成したときに、画像が画面外に少しでも出ておらず画面内にある時の判定を作りたいのですがどのように作ればいいのでしょうか。
よければこの問題を解決できる方がいれば御教授していただけると幸いです。

試したこと、
・特定の要素が画面に見えているかどうかを判定を試しました。
下記リンク
http://kimagureneet.hatenablog.com/entry/2016/10/23/005414
・画面からはみ出さないようにするにはを実装してみました。
下記リンク
http://rina.jpn.ph/~rance/directx8/06/02.html

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

miyabi-sun

2018/11/20 06:58

JavaとJavaScriptは「日本>東京」みたいな関係ではなく、「インドとインドネシア」レベルの別国家なので全然違います。タグから外してくだだいね。
guest

回答3

0

こういう時に使うのが Intersection Observer ですが、すでに解決となっているようなので紹介にとどめておきます。
https://developer.mozilla.org/ja/docs/Web/API/Intersection_Observer_API

投稿2018/11/20 09:29

x_x

総合スコア13749

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

要素の位置の取得
https://www.buildinsider.net/web/jqueryref/046
ウィンドウサイズの取得
https://bl6.jp/web/javascript/change-process-get-window-size/
ページ長さ
https://blow-in.net/blog/entry-1777.html

上記組み合わせればできます

投稿2018/11/20 06:55

yamato_user

総合スコア2321

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

ベストアンサー

画像が画面外に少しでも出ておらず画面内にある時の判定を作りたいのですが

判定ロジック自体は集合関係の数学の時間です。
Webページは四角、画面は四角、画像も四角。
ならば4隅の座標さえ抑えてしまえば分かりますよね。

4隅の座標の取得の仕方はryounaman19さんが紹介しているページを読んでください。
(jQueryというライブラリ前提なようなので、jQueryの導入方法も勉強してみてください。)

紙にXとYの線を引っ張って、画面という名前の四角い枠作って、
画像が全て画面内に収まっているには4隅の各座標はどういう条件なのか定義してください。
それを質問文のif (条件式)に投げ込めば完成します。

投稿2018/11/20 07:32

miyabi-sun

総合スコア21158

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

SaharaDesert

2018/11/20 08:46

出来ました。 ありがとうございました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問