ウェブ学のすすめ

Study of Web Design & Programing

2012-06-01から1ヶ月間の記事一覧

Appleの日本語サイトで使用されているフォント【AXIS】を無料で手に入れる方法

Appleの日本語サイトで使用されているフォント【AXIS(アクシス)】を無料で手に入れる方法をご紹介します。 作成しているサイトで必要だったので調べてみたら試用版として無料で使えることを発見しました。購入すると1ウェイト19,800円、7ウェイト全部そろえ…

PhotoshopでApple風布地テクスチャを作る

iPhoneやiPadの通知センター、iCloudなどの背景に使われている布地風テクスチャが欲しかったのでPhotoshopで作ってみました。 参考にしたサイト How to Create Apple’s Famous Linen Texture | Fuel Your Creativity 作り方 ※使用ソフト:Photoshop CS6 【1…

Adobe Photoshop Lightroom 4がCreative Cloudで利用可能に

Adobe Photoshop Lightroom 4 6月26日、Adobe Creative Cloudのラインナップに、RAW現像ソフト「Adobe Photoshop Lightroom 4」が加わりました(Adobe - アドビ システムズ社、Adobe Photoshop LightroomをCreative Cloudで提供開始)。↓機能などは公式ペー…

サイト・ブログの横にTwitterのFollow meボタンを設置する方法

現在制作しているサイトの横にTwitterのFollow meボタンを設置してみたのでその方法を残しておきます。 Follow meボタンの取得 【1】Twitter "Follow" Badge for your site / blogにアクセスする Twitter "Follow" Badge for your site / blog 【2】アカウン…

Apple風メニューバーの作り方(CSS3版)

CSS

プレビュー PC版 Apple風メニューバー - jsdo.it - share JavaScript, HTML5 and CSS スマートフォン版 Apple風メニューバー - js do it コード HTML <div id="wrapper"> <nav> <ul id="appleNav"> <li><a href="#"><img src="http://jsrun.it/assets/5/q/n/W/5qnWX.png" alt="Apple Logo"></a></li> <li><a href="#" class="current">ストア</a></li> <li></li></ul></nav></div>

Apple風メニューバーの作り方(CSS Sprite版)

CSS

プレビュー PC版 Apple風メニューバー(CSS Sprite版) - jsdo.it - share JavaScript, HTML5 and CSS スマートフォン版 Apple風メニューバー(CSS Sprite版) - js do it コード HTML <div id="globalheader" class="nav02"> <ul id="globalnav"> <li id="nav01"><a href="#">Apple</a></li> <li id="nav02"><a href="#">Store</a></li> <li id="nav03"></li></ul></div>

サイトプレゼンまであと1週間!やるべきことリスト

サイトプレゼン本番の6月29日まであと5日! やるべきことをリストにしてみました。 これまでのサイト構築 サイトプランのプレゼン(2012/6/1)Google プレゼンテーションをはてなダイアリーに貼りつける方法 - ウェブ学のすすめ バージョン1作成(2012/6/11)iPh…

配列で作る商品の単価と在庫の関係の表組み|実践課題F

プレビュー PC版 配列で作る商品の単価と在庫の関係の表組み - jsdo.it - share JavaScript, HTML5 and CSS スマートフォン版 配列で作る商品の単価と在庫の関係の表組み - js do it コード <html> <head> <meta charset="utf-8"> <title>配列</title> <style> body { font-family: "ヒラギノ角ゴ Pro W3", "Hiragino</meta></head></html>…

配列で作る商品の単価と個数の関係の表組み|実践課題E

プレビュー PC版 配列で作る商品の単価と個数の関係の表組み - jsdo.it - share JavaScript, HTML5 and CSS スマートフォン版 配列で作る商品の単価と個数の関係の表組み - js do it コード <html> <head> <meta charset="utf-8"> <title>配列</title> <style> body { font-family: "ヒラギノ角ゴ Pro W3", "Hiragino</meta></head></html>…

配列の演算|実践課題D

プレビュー PC版 配列の演算 - jsdo.it - share JavaScript, HTML5 and CSS スマートフォン版 配列の演算 - js do it コード <html> <head> <meta charset="utf-8"> <title>配列</title> <style> body { font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "MS Pゴシッ</meta></head></html>…

配列でリンクを表示|実践課題C

プレビュー PC版 配列でリンクを表示 - jsdo.it - share JavaScript, HTML5 and CSS スマートフォン版 配列でリンクを表示 - js do it コード <html> <head> <meta charset="utf-8"> <title>配列</title> <style> body { font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka</meta></head></html>…

配列で表組みを表示|実践課題B

プレビュー PC版 配列で表組みを表示 - jsdo.it - share JavaScript, HTML5 and CSS スマートフォン版 配列で表組みを表示 - js do it コード <html> <head> <meta charset="utf-8"> <title>配列</title> <style> body { font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka</meta></head></html>…

おみくじをランダム表示|実践課題A

プレビュー PC版 おみくじをランダム表示 - jsdo.it - share JavaScript, HTML5 and CSS スマートフォン版 おみくじをランダム表示 - js do it コード <html> <head> <meta charset="utf-8"> <title>配列</title> <style> body { font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiry</meta></head></html>…

JavaScriptにおける配列の書き方(1つの要素に複数の情報を格納したい場合)

プレビュー PC版 JavaScriptにおける配列の書き方(1つの要素に複数の情報を格納したい場合) - jsdo.it - share JavaScript, HTML5 and CSS スマートフォン版 JavaScriptにおける配列の書き方(1つの要素に複数の情報を格納したい場合) - js do it コード <html lang="ja"> <head> <meta charset="utf-8"></meta></head></html>…

JavaScriptにおける配列の書き方

プレビュー PC版 JavaScriptにおける配列の書き方(1) - jsdo.it - share JavaScript, HTML5 and CSS スマートフォン版 JavaScriptにおける配列の書き方(1) - js do it コード <html lang="ja"> <head> <meta charset="utf-8"> <title>配列</title> </head> <body> <script> var member = ['佐藤','伊藤','山田']; alert(member[2]+'さん');</body></html>…

JavaScriptで作る複利計算プログラム

複利とは 複利(ふくり)とは、複利法によって計算された利子のこと。複利法とは、元金によって生じた利子を次期の元金に組み入れる方式であり、元金だけでなく利子にも次期の利子がつく。新元金=元金+元金×利率 =元金×(1+利率)引用:複利 - Wikipedia …

Photoshopでカンプを作る方法

【1】新規作成 ↓サイズを設定 【2】定規を表示 「表示」→「定規」 「Ctrl」+「R」 【3】ガイドを引く 定規からガイドをドラッグする 「表示」→「新規ガイド」 ↓数値でガイドの位置を指定できる ※ガイドの色を変更するには 環境設定→「ガイド・グリッド・スラ…

減速スライドショー(基本形)

プレビュー Flash HTML5 減速スライド(基本形) - jsdo.it - share JavaScript, HTML5 and CSS スマートフォンの方はこちら 減速スライド(基本形) - js do it 作り方 Photoshop メイン用(500px×400px)を作る サムネイル用(100px×100px)を作る Flash Profe…

Adobe Creative Cloudからアプリケーションをインストールする方法

1.Adobe Creative Cloudにアクセスし、Adobe ID を使用してサインインする 2.ログイン後、「アプリケーション」をクリック 3.Adobe Application Managerをダウンロード ↓「OK」をクリック 4.Adobe Application Managerをインストール 5.Adobe IDを使用してサ…

Adobe Creative Cloud 無償メンバーシップに申し込む方法

無償メンバーシップに申し込むと30日間無償でCreative Cloudを利用することができます。有償版との違い無償メンバーシップ有償版ファイルストレージ2GB20GBTypekit1サイト、2フォント表示数:25,000サイト数、フォント数無制限500,000ビューまで表示Webホス…

ActionScript 2.0で作るスライドショー

プレビュー Flash HTML5 スライドショー - jsdo.it - share JavaScript, HTML5 and CSS コード this.onLoad = function(){ stop(); } go_btn.onRelease = function(){ if(_currentframe !=7){ nextFrame(); } else{ gotoAndStop(1); } } back_btn.onRelease …

ActionScript 2.0で作るスロットマシーン

プレビュー Flash HTML5 スロットマシーン - jsdo.it - share JavaScript, HTML5 and CSS コード this.onLoad = function(){ num01_mc.stop(); num02_mc.stop(); num03_mc.stop(); } start_btn.onPress = function(){ num01_mc.play(); num02_mc.play(); num…

Windows 7 64bitにXAMMPをインストールする方法

先日OSをWindows 7 64bitに変更したのでXAMPPをインストールし直しました。 64bitのOSだと不都合があるソフトもあるので心配でしたが、問題なくインストールできたのでその手順を残しておきます。 1.apache friends - xampp for windowsにアクセスし、イン…

JavaScriptで作る九九表

プレビュー↓PC版JavaScriptで作る九九表 - jsdo.it - share JavaScript, HTML5 and CSS ↓スマートフォン版JavaScriptで作る九九表 - js do it コード <html lang="ja"> <head> <meta charset="utf-8"> <title>九九の対数表</title> <style> table { border-collapse: collapse; } td,th { width: 50px; border: 1px solid #000;</meta></head></html>…

自作PCをWindows 7 64bit + SSD(Intel 330 Series 120GB)にアップグレードする方法

4年ぶりに自作PCのOSをアップグレードしたのでその手順を残しておきたいと思います。 OSを変更した理由Windows 8 優待購入プログラム 今Windows 7を購入するとWindows 8 Proがリリースされたら優待価格¥1,200で入手できる「Windows 8 優待購入プログラム」…

WWDC 2012 実況・中継・同時通訳サイト10選

WWDC 2012まであと30分弱!実況・中継・同時通訳サイトを調べてみました。12日午前2時からはじまる「WWDC 2012」の情報を、AppBankは力いっぱいお届けいたします! - AppBank週アスWWDC2012中継:iPhone5、RetinaなMacBook Pro、iOS6はどうなる?WWDC2012基…

標準体重計算プログラム ver 2.0|男女別

プレビュー PC版 標準体重計算プログラム ver 2.0|男女別 - jsdo.it - share JavaScript, HTML5 and CSS スマホ版 標準体重計算プログラム ver 2.0|男女別 - js do it コード <html> <head> <meta charset="utf-8"> <title>標準体重</title> </head> <body> <script type="text/javascript"> var height; var weight; var man; man = confirm("あなたは男</body></html>…

iPhone 5の噂・流出情報まとめサイト|iPhone噂.com

WWDC2012もとうとう明日午前2時から!まだ載せている情報は全然足りませんが、制作したサイト「iPhone噂.com」をご紹介します。iPhone 5の噂・流出情報まとめサイト|iPhone噂.com↓スマートフォン(iPhone)表示にも対応。 カウントダウンのJavaScriptは下記の…

ドルから円に換算を表示するJavaScript|【J14】

課題 【J14】 ドルから円に換算を表示するJavaScriptを記述しなさい。入力された数値を換算して、以下のように表示します。引用:練習課題(2) - Webデザインの勉強|忘筌 解答 PC版 ドルから円に換算を表示するJavaScript|【J14】 - jsdo.it - share Java…

成人かどうか判定する|【J13】

課題 以下のように表示するJavaScriptを記述しなさい。年齢が20歳以上であったら、以下のように表示されます。引用:練習課題(2) - Webデザインの勉強|忘筌 解答 PC版 成人かどうか判定する|【J13】 - jsdo.it - share JavaScript, HTML5 and CSS スマホ…