niwadesign » javascript http://www.niwadesign.jp ホームページ制作のネタ発信 Thu, 09 Jun 2011 11:44:07 +0000 ja hourly 1 http://wordpress.org/?v=3.1.3 iPhone用htmlのヘッダー要素のルールβ版 http://www.niwadesign.jp/archives/351 http://www.niwadesign.jp/archives/351#comments Tue, 08 Mar 2011 12:42:21 +0000 takehito http://www.niwadesign.jp/?p=351 Read more »

]]>

  • viewportは幅を指定するためのもの。
  • javascript部分はアドレスバーを非表示（画面の上に隠す）にするためのもの。
  • <link rel="apple-touch-icon" href="shortcut.png">はホームアイコンを設定するためのもの。
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
	<title>タイトル</title>
	<link rel="stylesheet" href="スタイルシートのパス" type="text/css">
	<link rel="apple-touch-icon" href="画像のパス">
	<script>
		function doScroll() { if (window.pageYOffset === 0) { window.scrollTo(0,1); } }
		window.onload = function() { setTimeout(doScroll, 100); }
	</script>
</head>

ホームアイコンを作成する

ツヤツヤ処理とか角丸とかは勝手にiPhone側でやってくれるのでベタなデザインにする。

画像サイズ
57×57ピクセル（但し、正方形であれば57ピクセル以上でも可）ただし、iPhone4は114×114

画像フォーマット
gif,jpg,png,bmpいずれも可

]]> http://www.niwadesign.jp/archives/351/feed 0 ソースコード表示に便利なsyntaxhighlighter http://www.niwadesign.jp/archives/67 http://www.niwadesign.jp/archives/67#comments Tue, 15 Apr 2008 02:43:54 +0000 takehito http://www.niwadesign.jp/archives/67 Read more »

]]> ソースコード表示に便利なsyntaxhighlighter

ブログに貼り付けたソースを見やすくしたいため色々調べてみるとsyntaxhighlighterがいろんなサイトで使われていたのでご紹介。

DL：http://code.google.com/p/syntaxhighlighter/

対応言語
C,C++,C#
CSS
Delphi
Java
JavaScript
PHP
Python
Ruby
SQL
VB
XML/HTM

使い方はとっても簡単。
<pre></pre>の間に表示したいコードを書きます。
<pre>のclassにhtmlやcssを書くだけ。

<pre name=“code” class=“html”>
ここにコードを書く。
</pre>
<link type=“text/css” rel=“stylesheet” href=“Styles/SyntaxHighlighter.css”></link>
<script language=“javascript” src=“Scripts/shCore.js”></script>
<script language=“javascript” src=“Scripts/shBrushXml.js”></script>
<script language=“javascript” src=“Scripts/shBrushCss.js”></script>
<script language=“javascript”>
dp.SyntaxHighlighter.ClipboardSwf = ‘Scripts/clipboard.swf’;
dp.SyntaxHighlighter.HighlightAll(‘code’);
</script>

サンプル

<a href="http://www.niwadesign.jp/">ニワデザイン</a>

※Word Pressなどで使う場合はjavascript部分はfooter.phpに書いときましょう。

]]> http://www.niwadesign.jp/archives/67/feed 0