Jquery 作者 John Resig 自身のカプセル化された JavaScript 共通関数_JavaScript スキル
//要素のスタイル値を取得します。
関数 getStyle(elem,name){
if(elem.style[name]){
return elem.style[name];
}else if(elem.currentStyle){
return elem.currentStyle[name];
}else if(document.defaultView&&document.defaultView.getComputedStyle){
name=name.replace(/([A-Z])/g,”-$1″); >name=name.toLowerCase();
var s=document.defaultView.getComputedStyle(elem,"");
return s&&s.getPropertyValue(name);
return null
}
}
//このページを基準とした要素の x 座標と y 座標を取得します。
function pageX(elem){
return elem.offsetParent?(elem.offsetLeft pageX(elem.offsetParent)):elem.offsetLeft;
}
function pageY(elem){
return elem.offsetParent?(elem.offsetTop pageY(elem.offsetParent)):elem.offsetTop;
}
//親要素を基準とした要素の x 座標と y 座標を取得します。
functionparentX(elem){
return elem.parentNode==elem.offsetParent?elem.offsetLeft:pageX(elem)-pageX(elem.parentNode)
}
functionparentY(elem); {
return elem.parentNode==elem.offsetParent?elem.offsetTop:pageY(elem)-pageY(elem.parentNode);
}
// を使用して配置された要素の x 座標と y 座標を取得します。 css 。
function posX(elem){
return parseInt(getStyle(elem,”left”));
}
function posY(elem){
return parseInt(getStyle(elem,”top) ”));
}
//要素の位置を設定します。
関数 setX(elem,pos){
elem.style.left=pos ”px”;
}
関数 setY(elem,pos){
elem.style.top=pos "px";
}
//要素の X 座標と Y 座標を増やします。
関数 addX(elem,pos){
set(elem,(posX(elem) pos));
}
関数 addY(elem,pos){
set(elem,( posY(elem) pos));
}
//CSS を使用して要素の高さと幅を取得し、サイズを制御します
function getHeight(elem){
return parseInt(getStyle(elem, "height") );
}
function getWidth(elem){
return parseInt(getStyle(elem,"width"));
}
// 要素を取得可能、完全な高さand width
function getFullHeight(elem){
if(getStyle(elem,”display”)!=”none”){
return getHeight(elem)||elem.offsetHeight
}else; {
var old=resetCss(elem,{display:”block”,visibility:”hidden”,position:”absolute”});
var h=elem.clientHeight||getHeight(elem); >restoreCss( elem,old);
return h;
}
}
function getFullWidth(elem){
if(getStyle(elem,”display”)!=”none”) {
return getWidth(elem)||elem.offsetWidth;
}else{
var old=resetCss(elem,{display:”block”,visibility:”hidden”,position:”absolute”} );
var w=elem.clientWidth||getWidth(elem);
return w;
}
;古いCSSを保存します。
関数resetCss(elem,prop){
var old={};
for(var i in prop){
old[i]=elem.style[i];
elem.style[i]=prop[i];
}
古いものを返す;
}
関数 stopCss(elem,prop){
for(var i in prop) {
elem.style[i]=prop[i];
}
}
//表示と非表示
function show(elem){
elem.style.display= elem.$oldDisplay||”;
}
関数 Hide(elem){
var curDisplay=getStyle(elem,”display”);
elem.$oldDisplay=curDisplay;
elem.style.display=”none”
}
}
//透明度を設定する
function setOpacity(elem,num); 🎜> if(elem.filters){
elem.style.filter=”alpha(opacity=” num ”)”
}else{
elem.style.opacity=num/100; >}
}
//Slide
function slideDown(elem){
var h=getFullHeight(elem);
elem.style.height=”0px”; elem) ;
for(var i=0;inew function(){
var pos=i; style.height=(pos/100*h) ”px”;},(pos*10));
}
}
}
//Gradient
関数 fadeIn(elem) {
show(elem);
setOpacity(elem,0);
for(var i=0;i新しい関数(){
var pos =i;
setTimeout(function(){setOpacity(elem,pos);},(pos 1)*10);
}
}
// を取得します。ページ全体上のマウス カーソルの相対位置。
function getX(e){
e=e||window.event;
return e.pageX||e.clientX document.body.scrollLeft;
}
function getY(e ){
e=e||window.event;
return e.pageY||e.clientY document.body.scrollTop;
}
// に対するマウス カーソルの位置を取得します。現在の要素。
function getElementX(e){
return (e&&e.layerX)||window.event.offsetX;
}
function getElementY(e){
return (e&&e.layerY)|| window.event.offsetY;
}
//ページの高さと幅を取得します
function getPageHeight(){
var de=document.documentElement
return document.body.scrollHeight; || (de&de.scrollHeight);
function getPageWidth(){
var de=document.documentElement;|(de&de.scrollWidth); }
//スクロールバーの位置を取得します。
functionscrollX(){
var de=document.documentElement;
return self.pageXOffset||(de&&de.scrollLeft)||document.body.scrollLeft;
}
functionscrollY(){
var de=document.documentElement;
return self.pageYOffset||(de&&de.scrollTop)||document.body.scrollTop;
}
//ビューの高さと高さを取得します。
function windowHeight() {
var de = document.documentElement;
return self.innerHeight||(de && de.offsetHeight)||document.body.offsetHeight;
}
function windowWidth() {
var de = document.documentElement;
return self.innerWidth||( de && de.offsetWidth )||document.body.offsetWidth;
}

ホットAIツール

Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。

Undress AI Tool
脱衣画像を無料で

Clothoff.io
AI衣類リムーバー

Video Face Swap
完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

人気の記事

ホットツール

メモ帳++7.3.1
使いやすく無料のコードエディター

SublimeText3 中国語版
中国語版、とても使いやすい

ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境

ドリームウィーバー CS6
ビジュアル Web 開発ツール

SublimeText3 Mac版
神レベルのコード編集ソフト(SublimeText3)

ホットトピック









WebSocket と JavaScript を使用してオンライン音声認識システムを実装する方法 はじめに: 技術の継続的な発展により、音声認識技術は人工知能の分野の重要な部分になりました。 WebSocket と JavaScript をベースとしたオンライン音声認識システムは、低遅延、リアルタイム、クロスプラットフォームという特徴があり、広く使用されるソリューションとなっています。この記事では、WebSocket と JavaScript を使用してオンライン音声認識システムを実装する方法を紹介します。

WebSocketとJavaScript:リアルタイム監視システムを実現するためのキーテクノロジー はじめに: インターネット技術の急速な発展に伴い、リアルタイム監視システムは様々な分野で広く利用されています。リアルタイム監視を実現するための重要なテクノロジーの 1 つは、WebSocket と JavaScript の組み合わせです。この記事では、リアルタイム監視システムにおける WebSocket と JavaScript のアプリケーションを紹介し、コード例を示し、その実装原理を詳しく説明します。 1.WebSocketテクノロジー

JavaScript と WebSocket を使用してリアルタイム オンライン注文システムを実装する方法の紹介: インターネットの普及とテクノロジーの進歩に伴い、ますます多くのレストランがオンライン注文サービスを提供し始めています。リアルタイムのオンライン注文システムを実装するには、JavaScript と WebSocket テクノロジを使用できます。 WebSocket は、TCP プロトコルをベースとした全二重通信プロトコルで、クライアントとサーバー間のリアルタイム双方向通信を実現します。リアルタイムオンラインオーダーシステムにおいて、ユーザーが料理を選択して注文するとき

WebSocket と JavaScript を使用してオンライン予約システムを実装する方法 今日のデジタル時代では、ますます多くの企業やサービスがオンライン予約機能を提供する必要があります。効率的かつリアルタイムのオンライン予約システムを実装することが重要です。この記事では、WebSocket と JavaScript を使用してオンライン予約システムを実装する方法と、具体的なコード例を紹介します。 1. WebSocket とは何ですか? WebSocket は、単一の TCP 接続における全二重方式です。

JavaScript と WebSocket: 効率的なリアルタイム天気予報システムの構築 はじめに: 今日、天気予報の精度は日常生活と意思決定にとって非常に重要です。テクノロジーの発展に伴い、リアルタイムで気象データを取得することで、より正確で信頼性の高い天気予報を提供できるようになりました。この記事では、JavaScript と WebSocket テクノロジを使用して効率的なリアルタイム天気予報システムを構築する方法を学びます。この記事では、具体的なコード例を通じて実装プロセスを説明します。私たちは

JavaScript チュートリアル: HTTP ステータス コードを取得する方法、特定のコード例が必要です 序文: Web 開発では、サーバーとのデータ対話が頻繁に発生します。サーバーと通信するとき、多くの場合、返された HTTP ステータス コードを取得して操作が成功したかどうかを判断し、さまざまなステータス コードに基づいて対応する処理を実行する必要があります。この記事では、JavaScript を使用して HTTP ステータス コードを取得する方法を説明し、いくつかの実用的なコード例を示します。 XMLHttpRequestの使用

使用法: JavaScript では、insertBefore() メソッドを使用して、DOM ツリーに新しいノードを挿入します。このメソッドには、挿入される新しいノードと参照ノード (つまり、新しいノードが挿入されるノード) の 2 つのパラメータが必要です。

JavaScript は Web 開発で広く使用されているプログラミング言語であり、WebSocket はリアルタイム通信に使用されるネットワーク プロトコルです。 2 つの強力な機能を組み合わせることで、効率的なリアルタイム画像処理システムを構築できます。この記事では、JavaScript と WebSocket を使用してこのシステムを実装する方法と、具体的なコード例を紹介します。まず、リアルタイム画像処理システムの要件と目標を明確にする必要があります。リアルタイムの画像データを収集できるカメラ デバイスがあるとします。
