Music - Quick Time Movie - Quick Time  Real Guide  Windows Media   BIGLOBE  Fashion TV  Web ラジオ   Playboy Playmates  Emision Digital  Batanga  BBC  msn Radio Station  So-net Broadband  Music@nifty  comfm.com 

内山理名  天海祐希  鶴田真由  上原多香子  中島美嘉   BoA  羽田美智子  上戸彩   元ちとせ   五輪真弓   川村結花   MISIA  安良城紅  松田聖子  安室奈美恵  倉木麻衣  MINMI  melody  相川七瀬   倖田來未  島谷ひとみ  今井絵理子  太田裕美   五嶋みどり   高嶋ちさ子  CARLA BLEY  ケイコ・リー   矢野顕子   山村礼子  国井律子  清水ミチコ 矢野沙織

 

Aston Martin  Ferrari  Jaguar  Pontiac  Lamborghini  Alfaromeo  BMW  Citroen  Volvo  Audi  Volkswagen  Benz  Peugeot
世界のダウンロード検索エンジン集、カテゴリ区分されたオンラインソフトのリンク探索 Win関連ソフトウェアのダウンロード Win Mac関連ソフトウェアのダウンロード Mac FixPak、BIOS、デバイスドライバー、パッチ、アップデート、体験版を get ! メーカー 毎日更新する新着情報、あ〜ん・A〜Z順 一覧のオンラインソフトをゲット! あ〜Z 主なソフトの提供者たち ベンダー 最強のサーチエンジンとリンクで世界のMP3ニュース、ファイル、プレイヤーをゲット! MP3 世界のゲームサーチエンジン・リンク集で、ニュース、オンラインソフトをゲット! ゲーム コンピューター、インターネット、PCショップ、言語、プログラミング PC・インターネット Webラジオ -小Win - 3個のプルダウンメニュー、Jazz・ワールド・クラシック・ポップス・ロック WebRadio キャリアー・方式・市販価格・主な性能・発売日、関連リンクなど。 列ソート・入れ替え。 携帯情報 Java、JavaScript、DHTML、XML、CSS、フレームなどのサンプル・応用方法など JavaScript CSSリファレンス、応用方法、サンプル(例) スタイルシート 全種類フレームサンプル、応用方法、ヒント。 フレームサンプル 色作成、モニター、RGB - 16進カラーコード取得 - 小Winで開きまっ…* 色記号 ショートカットキー : Windows、ie、Outlook、Office、Notes、一太郎 ショートカットキー カレンダーいろいろ、日程表用、時計、潮汐表 カレンダー 理性もまた、奔走する情熱一種である。- 散文、Jazz・Worlddrag_drop4a.htmコレクション、叙情詩日記
 ☆・:*:・°'★,。・:*:drag_drop4a.htm・°'☆ (゚∇゚) 

 
=(゜。.゜)= (^o^) (゚∇゚) (^.^)   コメント。:
サイト 51  サイト 52  サイト 53  サイト 54
 drag_drop4a.htm└|∵|┐drag_drop4a.htm└|∵|┘drag_drop4a.htm┌|∵|┘drag_drop4a.htm (・!・) 〔`。´ 〕 φ(.. )

 
(・!・)φ(.. ) (>_<) 〔`。´ 〕   コメント。:
サイト 61  サイト 62  サイト 63  サイト 64
 drag_drop4a.htm└|∵|┐drag_drop4a.htm└|∵|┘drag_drop4a.htm┌|∵|┘drag_drop4a.htm (-."-;)

(*^.^*) (-."-;) (^.^;) (^o^) …(¨ ),( ¨)  コメント。:
サイト 71  サイト 72  サイト 73  サイト 74 =(^。^)=  (*^.^*) \^o^/ =(゜。.゜)= =(・。.・)= (^ ^)

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

ホーム へ       サンプルページ  ドラッグ・ドロップ 4a  drag_drop4a.htm

タブでスクロール可能な、DIV。      DHTML、DOM drag and drop script。      配置、サイズ、コンテンツなどのカスタマイズはテキストエディターなどで可。    all 対応。     コピー、編集し、簡単にWebで応用できまっ、(^ ^)。

デモは、スクロールなどで。

 

< ご使用方法 >

 ・ ローカル(=PC)への保存は、drag_drop4/ をクリック開いたホルダーで、drag_drop4a.htm、0020100.js ほかを右クリック、[対象をファイルに保存] - 【ファイルのダウンロード】、【ファイル名を付けて保存】 - <保存する場所>: ……、などで。   ※: 変わってしまったファイル名や、*.html 中のパスは要修正。   

 ・ このDHTMLの実装方法は、drag_drop4a.htm をテキストエディターで開き、ホームページ作成ソフトなどのHTML挿入/編集メニューなどを使って、新しいページ 1 や hogehoge.html(=任意の挿入先ファイル名) の、 <head> 〜 </head> の任意の行間に (*1)を、さらに <body> 〜 </body>の任意の行間に (*2) をペーストします。

 ・ 編集方法は、hogehoge.html をテキストエディター、あるいは ”FrontPage Express” などのホームページ制作ソフトのHTMLタグ挿入/編集メニュー で開き編集します。    下記の(例) (*1) と、(*2) を参考に太字部分の編集を任意に行います。   ※: テキストエディターによる編集は、HP制作ソフトとの互換性の問題を生じません(HP制作ソフト間は少し生じる)。

 ・ 作動テストは、ローカル(PC)に保存し、 Internet Explorer 8.x〜 などで開いて。    更新の確認は [F5]キー を押し、サーバーやブラウザーのキャッシュクリアー、最新データ読み込み(≠再アクセス)で行います。

 ・ アップロードや作動テストは、hogehoge.html と同じ階層〔ホルダー/ディレクトリー〕に、使用する画像、*.jsなども転送/配置し実施。  ※:別ディレクトリーに配置時は、*.html 中のパスは要修正。   FTPなどで変わったファイル名は要修正。    スクリプト構文中への改行混入は非作動原因。

 ・ 関連情報 : 色記号62スタイルシートリファレンスホームページ開設入門が便利!。   Web DevelopmentWeb開発MSDN IE8 HTMLとCSS開発ツールでサイトを修正スクリプト デバッグの概要HTMLとCSSのサポートCSSの改良点IE7IE6XMLDHTML

 

(*1) : drag_drop4a.htm (例)         挿入先の  <head> 〜 </head> の、 部分にペーストします。

 HTMLの編集方法   (*1) をテキストエディターで開き、下記↓のHTMLを挿入先ファイルにペースト、太字部分を編集し使用。
〔この列ペースト不要〕   

シフトJIS使用(削除不可)

ieなどに表示するアイコンファイル名(削除可)

<style type= </style>は(削除可)
(*1)〜(*3)表タイトル背景

body 文字色 背景色 下線
ハイパーリンク 〃
表示済みの〃
マウスオーバー時の〃
クリック中の〃
フォント

 

リンクを新しいWinで開くを標準(削除可)※:target= いろいろ
同じフレーム=_self、ページ全体=_top、親フレーム=_parent
お気に入り、タスクバーに表示するページ名(≠ファイル名)

 

<meta http-equiv="Content-Type" content="text/html; charset=x-sjis">

<link REL="SHORTCUT ICON" href="favicon.ico">

<style type="text/css"><!--
.xxx0 { background: #F9F8F9 url('wttec.gif'); }
.xxx1 { background-color:#E3E0DC; }
.xxx2 { background-color:#FFFFFF; }
body { color:#000000; background: #F9F8F9 url('wttec.gif'); text-decoration:none; }
a:link { color:#3C0055; background-color:#FBFAFE; text-decoration:none; }
a:visited { color:#270037; background-color:#EDECEF; text-decoration:none; }
a:hover { color:#1F002E; background-color:#D2F3F4; text-decoration:underline; }
a:active { color:#1F002E; background-color:#F5FFD2; text-decoration:underline; }
font { font-size:12px;line-height:13px;}
body,tr,td,form{ font-family:MS PGothic,MS Gothic,Verdana; font-size: 12px}
 --></style>

<base target="_blank">

<title>サンプルページ  ドラッグ・ドロップ 4a</title>

<!-- ☆ ----------- ↓ この間をコピー&ペーストします。 ------------ -->
<script type="text/javascript" src="0020100.js"></script>
<style type="text/css">
#thumb {     /*  スライド バー   */
position:relative;
height:30px;
width:12px;
background:#AB86E1 url('http:// …… .gif');
border:1px outset #eee;
}
</style>
<!-- ☆ ----------- ↑ この間をコピー&ペーストします。 ------------ -->
 

 

(*2) drag_drop4a.htm (例)        挿入先の  <body> 〜 </body> の、 部分にペーストします。

 HTMLの編集方法   (*2)をテキストエディターで開き、下記↓のHTMLを挿入先ファイルにペースト、太字部分を編集し使用。
〔この列ペースト不要〕

※:<body> 部の編集 背景 リンク 表示済みリンクンク アクティブリンクの各色(任意値)

コンテナサイズ 余白(スライドバー間) 背景画像 

余白

表示テキスト、HTML

 

 

 

 

 

 

スライド幅

 

<body bgcolor="#F8F5F5" link="#54006C" vlink="#62000D" alink="#00FFFF">

<!--webbot bot="HTMLMarkup" startspan -->
<!-- ★ ----------- ↓ この間をコピー&ペーストします。 ------------ -->
<div style="width: 350px; height: 200px; overflow: scroll; border: 1px solid #D5CED3; float:left; margin-right:2px; margin-left:0px; background:#FFFFFF url('../wttec.gif');
border:1px solid #D5CED3; position: relative">
<div id="scrollcontent" style="position:absolute; left:0; top:0; padding:5px;">

<div>
<p><img border="0" src="http:// …… .jpg"

====  この間、説明を省略。  ==== 

</table>
</div>
</div>
</div>
<div style="width: 30px; float: left">
<div id="thumb" style="left:0; top:0;"></div>
</div>

<script language="javascript">
var aThumb = document.getElementById("thumb");
var scrolldiv=document.getElementById("scrollcontent");
Drag.init(aThumb, null, 0, 0, 0, 170);
aThumb.onDrag = function(x, y) {
scrolldiv.style.top=y * (-1) +"px";
}
</script>
<!-- ★ ----------- ↑ この間をコピー&ペーストします。 ------------ -->
<!--webbot bot="HTMLMarkup" endspan -->

 

< 補足 >    適時参照あれ!。

 ・ Wordpad によるHTMLソース(タグ)を見ながらの直接編集方法。