タグ

WEBdesignとtutorialに関するmryのブックマーク (2)

  • jQueryで自作するフローティングウィンドウ (1/2)

    「フローティングウィンドウ」は、Webページ文に重ねて表示し、ドラッグ&ドロップ操作で移動できる子ウィ ンドウのことです。といっても、ブラウザーの画面内にウィンドウのように表示するだけですので、ブラウザーやウイルス対策ソフトのポップアップブロック機能に規制されることもありませんし、追加的な情報を元のWebページのレイアウトを崩さずに表示できるメリットがあります。 基のフローティングウィンドウを作成する 今回は、「フローティングウィンドウを表示」のリンクをクリックするとフローティングウィンドウを開くWebページを作成します。開いたウィンドウはドラッグ&ドロップ操作でページ内を自由に移動でき、右上に配置した「×」ボタンで閉じられます。 まず、以下のようなHTML/XHTML(以下、HTML)を用意します。リンクのテキストをa要素で包み、class属性に「open」を付けます。このa要素は、

    jQueryで自作するフローティングウィンドウ (1/2)
  • Learn CSS Positioning in Ten Steps: position static relative absolute float

    This tutorial examines the different layout properties available in CSS: position:static, position:relative, position:absolute, and float. 1. position:static The default positioning for all elements is position:static, which means the element is not positioned and occurs where it normally would in the document. Normally you wouldn't specify this unless you needed to override a positioning that had

  • 1