関連の質問です。
icon1.gifの下にリンクのない、画像ファイルを１つか２つか、つけ
その下に文章とPDFへのリンクをつけるのですが、、、
下記のような、感じです。icon1.gif～5までは、リンクがはってあります。
-------------------------------------------------------------------
icon1.gif icon2.gif icon3.gif icon4.gif icon5.gif
リンクのない画像ファイル
文章・・・・PDFへのリンク
リンクのない画像ファイル
文章・・・・PDFへのリンク
-------------------------------------------------------------------
↑のような感じでつくりたいのですが・・
リンクのない画像ファイルと、文章は、それぞれicon1.gif～5
のリンクの内容です。
なぜか、、、
プレビューで、icon1.gifをクリックしないと、リンクのない画像ファイル
が表示されないのです。
（本来は、URLを開いた時点で、リンクのない画像ファイルを表示したい）
icon2.gif～5にも、icon1.gifの文章のみが表示されます。
＃icon1.gifの文章は、icon2.gif～5には、表示させたくないのです。
どうか、ご教示、お願いします。本当に、ご迷惑かけます。m(_ _)m
ソースは、補足につけます。
度々連続投稿で、すいませんがhttp://q.hatena.ne.jp/1417608613#a1241190
関連の質問です。もうPCのバッテリーが切れそうです。
PDFへのリンクは、自力で、なんとかできたのですが・・・
PDFへのリンクを、クリックすると、リンクのあるicon1.gif～5を
全部埋めて、全画面でPDFが、開いてしまいます。
これをicon1.gif～5を残したまま、下にPDFの内容を表示したいの
ですが・・・可能でしょうか。
すいません、もう、ポイントがないので、奮発できないです。m(_ _)m
自分でも、時間ギリギリまで、調べたのですが、わかりませんでした。
どうか、ご教示をお願いします
305
278
1
1
コメント（21件)
<meta charset="UTF-8">
<meta name="GENERATOR" content="JustSystems Homepage Builder Version 19.0.0.1 Trial for Windows">
<style>
<!--
#content-box .info{
display: none;
}
#content-box .current{
display: block;
}
-->
#menu .menu-ico,
#seating-plan td{
cursor: pointer;
}
-->
#menu{
margin-bottom: 100px; // ここで好きな数値を指定
}
[href$=".pdf"]{
background: url(pdf.gif) no-repeat 100% 50%;
}
* html a.pdf{
background: url(pdf.gif) no-repeat 100% 50%;
}
-->
</style>
<script src="jquery-1.11.1.min.js"></script>
<script>
$(function(){
$( "#menu .menu-ico" ).click(function() {
var imgid = $( this ).index();
$("#content-box .info").hide();
$("#content-box .info").eq(imgid).show();
});
});
</script>
<title>営業部</title>
</head>
<body>
<p style="font-size : medium;"><b><i><font SIZE="5">営業部のホームページへようこそ！！</font></i></b><br>
</p>
<div id="menu">
<img src="icon1.gif" width="130" height="55" border="0" class="menu-ico">
<img src="icon2.gif" width="130" height="55" border="0" class="menu-ico">
<img src="icon3.gif" width="130" height="55" border="0" class="menu-ico">
<img src="icon4.gif" width="130" height="55" border="0" class="menu-ico">
<img src="icon5.gif" width="130" height="55" border="0" class="menu-ico">
</div>
<div id="content-box">
<p class="info" current"><img src="icon1.gif" width="130" height="55" border="0"></p>画像1の内容？<a href="test.pdf">テスト用PDF</a>
<p class="info">画像2の内容？</p>
<p class="info">画像3の内容？</p>
<p class="info">画像4の内容？</p>
<p class="info">画像5の内容？</p>
</div>
</body>
</html>
人力検索はてなでは質問の編集が可能ですし、以前の質問でも使っていたので知っていると思いますが、補足メッセージを投稿する事も可能です。
※チャット状態で受け答え可能な人はあまりいないと思いますし、接続可能な時に確認するといいと思いますよ。
動作確認はしていませんが、とりあえずおかしい箇所がありますので、そこを修正してみてください。
スタイルシートやコメントは「<!--」～「-->」までで一組で、入れ子にする事はできません。
終了タグ「-->」が2つ余分に記述されているので、これらを削除して確認してみてください。
スタイルシートの記述内に何かコメントを残したいのでしたら、「// 行内において以降はすべてコメント」または「/* ここにコメント */」を利用するといいです。javascript コメント
/* 複数行のコメントも可能です。
* サンプルテキストサンプルテキスト
* サンプルテキスト
*/
※javascriptでも同じ書き方でコメントになります。
・Javascriptの変数とコメント
http://www.rsch.tuis.ac.jp/~mizutani/online/javascript/variable.html
※次のように書いてコメントとする事で、コードの無効・有効切り替えを簡単に行っている人もいるようです。
・ブロックコメントの工夫
http://qiita.com/Hiraku/items/de8c44520d5aa9268ac7
上記のスタイルシートのコメントの記述の他に、間違いが2箇所見つかりました。
・各内容を入れるボックスp要素(タグ)のクラス指定で「"」が余分にあります。(※「info」の直後で閉じているので、クラス名は「info」のみ指定されている状態です。「current」は外に出ている為、存在しない属性として認識・無視されていると思います。)
・画像およびPDFへのリンクがp要素の閉じタグより後ろに記述されていて、各内容を入れるボックスの外に出ています。(※これにより「icon2.gif」から「icon5.gif」のどのアイコン画像の時にも表示されている状態でした。)
正しくは以下のようになります。
<div id="content-box">
<p class="info current">
<img src="icon1.gif" width="130" height="55" border="0">画像1の内容？
<a href="test.pdf">テスト用PDF</a>
</p>
<!-- 省略 -->
</div>
いま、帰ってきました。質問を一つにまとめます。
このあと、すいません、予定があるので、、、、すいません。
下に別質問で、いただいた、コメントをつけさせていただきます。
今日は、すいません。。。ここまでです。許してください。m(_ _)m
------------------------------------------------------------
どちらもPDFへのリンクに関連して発生した質問のようですので、質問をどちらか一つにまとめた方がいいと思います。
人力検索はてなでは質問の編集が可能ですし、以前の質問でも使っていたので知っていると思いますが、補足メッセージを投稿する事も可能です。
※チャット状態で受け答え可能な人はあまりいないと思いますし、接続可能な時に確認するといいと思いますよ。
..
id:rouge_2008
rouge_2008 2014/12/08 20:36:03
もう一つの質問(http://q.hatena.ne.jp/1418024839)にコメントしました。
おそらく解決すると思いますので、その時は締め切り状態にして自動終了まで待ってください。
(※キャンセルすると消えてしまいます。)
こちらの質問についてですが、おそらく無理です。
> PDFへのリンクを、クリックすると、リンクのあるicon1.gif～5を
> 全部埋めて、全画面でPDFが、開いてしまいます。
これはブラウザの仕様と設定によります。
リンク先がPDFの場合、ブラウザの設定によりプラグインを利用して表示するか、あるいはファイルのダウンロードになりますので、訪問者ごとにアクセス時の動作が違うはずです。
PDFをHTML内に表示する機能はないと思いました。(※PDFの内容を取得して、HTMLに変換するプログラムを作成するしかないのではないかと思います。)
> これをicon1.gif～5を残したまま、下にPDFの内容を表示したいの
> ですが・・・可能でしょうか。
上記の理由により、アイコン画像の下(※HTML内)に表示する事はできないと思います。
..
id:a-kuma3
a-kuma3 2014/12/08 23:13:08
＞こちらの質問についてですが、おそらく無理です。
細かい制御は無理ですけど、iframe に表示する、という手はあります。
できあがりのイメージがいまいち分かってないですが、html の範囲だけでやるなら、
<div id="content-box">～</div> の内容を、別の HTML にしておいて、
<div id="menu">
...
</div>
<iframe src="profile.html"></iframe>
で、profile.html は、
<div id="content-box">
<p class="info" current"><img src="icon1.gif" width="130" height="55" border="0"></p>画像1の内容？<a href="test.pdf">テスト用PDF</a>
<p class="info">画像2の内容？</p>
<p class="info">画像3の内容？</p>
<p class="info">画像4の内容？</p>
<p class="info">画像5の内容？</p>
</div>
とか。
「画像1の内容？」を残したいなら、
<div id="content-box">
<p class="info" current"><img src="icon1.gif" width="130" height="55" border="0"></p>画像1の内容？<a target="profile" href="test.pdf">テスト用PDF</a>
...
</div>
<iframe name="profile"></iframe>
と、リンクに target 属性をつけて、name を指定した iframe を入れるとか。
PDF が、iframe のサイズ内に入る見た目になってる、という条件は付きますが。
..
id:rouge_2008
rouge_2008 2014/12/10 04:46:36
前者の(※コンテンツ部分「<div id="content-box">～</div>」を別ファイルにして読み込む)場合、そのままのコードでは切り替え表示が動作しなくなります。
後者の場合、いくらか追加しますがほぼそのままのコードで動作しました。
一応以下に記載します。
・HTML(※切り替え表示コンテンツ部分のみ)
------------------------------------------------------
<div id="content-box">
<p class="info current">
<img src="icon1.gif" width="130" height="55" border="0">
画像1の内容？<a target="pdffile" href="test.pdf">テスト用PDF</a>
</p>
<p class="info">
<img src="icon2.gif" width="130" height="55" border="0">
画像2の内容？<a target="pdffile" href="test2.pdf">テスト用PDF2</a>
</p>
<p class="info">
<img src="icon3.gif" width="130" height="55" border="0">
画像3の内容？<a target="pdffile" href="test3.pdf">テスト用PDF3</a>
</p>
<!-- 省略 -->
<iframe name="pdffile" id="pdffile"></iframe>
</div>
------------------------------------------------------
※「<p class="info current">」～「</p>」までが各コンテンツの内容で1セットになっています。
※その後ろにpdfファイルの表示領域をiframeタグで追加します。
・CSS(※初期状態でiframeを非表示にするスタイルシート)
------------------------------------------------------
#pdffile {
display: none;
width: 500px; // iframeの表示幅※任意のサイズを指定
height: 250px; // iframeの高さ※任意のサイズを指定
}
------------------------------------------------------
・jQuery(※リンククリックで表示したpdfファイルが表示されたままにならない為のコード)
------------------------------------------------------
$(function(){
$( "#menu .menu-ico" ).click(function() {
var imgid = $( this ).index();
$("#content-box .info").hide();
$("#content-box .info").eq(imgid).show();
$("#content-box #pdffile").hide(); //この行を追加
});
// ここから追加
$( "#content-box .info a" ).click(function() {
$( "#content-box #pdffile" ).show();
});
// ここまで追加
});
------------------------------------------------------
※HTMLとCSSは追加・変更部分のみ記述していますので、現在のコードに追加・変更してください。
後は動作を確認してみてから、希望と違う部分があったら教えてください。
前者の方法が良かったでしょうか？
-----------------------------------------------------------------------
ですけど、補足で質問を書いてあるので、、、、
次から、気をつけます。
今日は、下記をやりました。。。。もう今日は、これが限界です。
すいません、同じことを何度も聞いて、すいません。やっぱり、icon2.gif（リンク）～5まで
icon1.gif（リンク）の内容の一部が表示されます。
---------------------------------------------------------------------------
rouge_2008 2014/12/08 20:24:02
確認結果です。
上記のスタイルシートのコメントの記述の他に、間違いが2箇所見つかりました。
・各内容を入れるボックスp要素(タグ)のクラス指定で「"」が余分にあります。(※「info」の直後で閉じているので、クラス名は「info」のみ指定されている状態です。「current」は外に出ている為、存在しない属性として認識・無視されていると思います。)
・画像およびPDFへのリンクがp要素の閉じタグより後ろに記述されていて、各内容を入れるボックスの外に出ています。(※これにより「icon2.gif」から「icon5.gif」のどのアイコン画像の時にも表示されている状態でした。)
正しくは以下のようになります。
<div id="content-box">
<p class="info current">
<img src="icon1.gif" width="130" height="55" border="0">画像1の内容？
<a href="test.pdf">テスト用PDF</a>
</p>
<!-- 省略 -->
</div>
-------------------------------------------------------------------------
すみません、やっぱり、私頭まわってないですね。。。。m(_ _)m
icon2.gif（リンク）～icon5までクリックしますと、icon1.gifの一部の内容が
表示されてしまいます。すいません、目的が達成できないのです。
<div id="content-box">を調べても、英語で、、、、、、
ソースは、下記です。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="GENERATOR" content="JustSystems Homepage Builder Version 19.0.0.1 Trial for Windows">
<style>
<!--
#content-box .info{
display: none;
}
#content-box .current{
display: block;
}
#menu .menu-ico,
#seating-plan td{
cursor: pointer;
}
#menu{
margin-bottom: 100px; /* ここで好きな数値を指定*/
}
[href$=".pdf"]{
background: url(pdf.gif) no-repeat 100% 50%;
}
* html a.pdf{
background: url(pdf.gif) no-repeat 100% 50%;
}
-->
</style>
<script src="jquery-1.11.1.min.js"></script>
<script>
$(function(){
$( "#menu .menu-ico" ).click(function() {
var imgid = $( this ).index();
$("#content-box .info").hide();
$("#content-box .info").eq(imgid).show();
});
});
</script>
<title>営業部</title>
</head>
<body>
<p style="font-size : medium;"><b><i><font SIZE="5">営業部のホームページへようこそ！！</font></i></b><br>
</p>
<div id="menu">
<img src="icon1.gif" width="130" height="55" border="0" class="menu-ico">
<img src="icon2.gif" width="130" height="55" border="0" class="menu-ico">
<img src="icon3.gif" width="130" height="55" border="0" class="menu-ico">
<img src="icon4.gif" width="130" height="55" border="0" class="menu-ico">
<img src="icon5.gif" width="130" height="55" border="0" class="menu-ico">
</div>
<div id="content-box">
<p class="info current">
<img src="icon1.gif" width="130" height="55" border="0"><br>画像1の内容？
<a href="test.pdf">テスト用PDF</a>
</p>
<img src="icon1.gif" width="130" height="55" border="0"><br>画像1の内容？
<a href="test.pdf">テスト用PDF</a>
<p class="info" >画像2の内容？</p>
<p class="info" >画像3の内容？</p>
<p class="info" >画像4の内容？</p>
<p class="info" >画像5の内容？</p>
</div>
</body>
</html>
変更したのですが、、、最初のプレビューで
icon1.gif（リンクの内容が）～5まで一気に表示されてしまいます。
ですが、icon5.gif（リンク）まで、クリックして、icon1.gifを
クリックすると、icon1.gifの下に画像２つと文章２つが
目的の通り、表示されます。大変申し訳ありません。今日は、、、、
これで、限界です。m(_ _)m
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="GENERATOR" content="JustSystems Homepage Builder Version 19.0.0.1 Trial for Windows">
<style>
<!--
#content-box .info{
display: none;
}
#content-box .current{
display: block;
}
#menu .menu-ico,
#seating-plan td{
cursor: pointer;
}
#menu{
margin-bottom: 100px; /* ここで好きな数値を指定*/
}
[href$=".pdf"]{
background: url(pdf.gif) no-repeat 100% 50%;
}
* html a.pdf{
background: url(pdf.gif) no-repeat 100% 50%;
}
-->
</style>
<script src="jquery-1.11.1.min.js"></script>
<script>
$(function(){
$( "#menu .menu-ico" ).click(function() {
var imgid = $( this ).index();
$("#content-box .info").hide();
$("#content-box .info").eq(imgid).show();
});
});
</script>
<title>営業部</title>
</head>
<body>
<p style="font-size : medium;"><b><i><font SIZE="5">営業部<br>
営業部のホームページへようこそ！！</font></i></b><br>
</p>
<div id="menu">
<img src="icon1.gif" width="130" height="55" border="0" class="menu-ico">
<img src="icon2.gif" width="130" height="55" border="0" class="menu-ico">
<img src="icon3.gif" width="130" height="55" border="0" class="menu-ico">
<img src="icon4.gif" width="130" height="55" border="0" class="menu-ico">
<img src="icon5.gif" width="130" height="55" border="0" class="menu-ico">
</div>
<div id="content-box">
<p class="info current">
<img src="icon1.gif" width="130" height="55" border="0"><br>画像1の内容？
<a href="test.pdf">テスト用PDF</a>
<br>
<br>
<img src="icon1.gif" width="130" height="55" border="0"><br>画像1の内容？
<a href="test.pdf">テスト用PDF</a>
</p>
<p class="info current">
<img src="icon2.gif" width="130" height="55" border="0"><br>画像2の内容？
<a href="test.pdf">テスト用PDF</a>
<br>
<br>
<img src="icon2.gif" width="130" height="55" border="0"><br>画像2の内容？
<a href="test.pdf">テスト用PDF</a>
<p class="info current">
<img src="icon3.gif" width="130" height="55" border="0"><br>画像3の内容？
<a href="test.pdf">テスト用PDF</a>
<br>
<br>
<img src="icon3.gif" width="130" height="55" border="0"><br>画像3の内容？
<a href="test.pdf">テスト用PDF</a>
<p class="info current">
<img src="icon4.gif" width="130" height="55" border="0"><br>画像4の内容？
<a href="test.pdf">テスト用PDF</a>
<br>
<br>
<img src="icon4.gif" width="130" height="55" border="0"><br>画像4の内容？
<a href="test.pdf">テスト用PDF</a>
<p class="info current">
<img src="icon5.gif" width="130" height="55" border="0"><br>画像5の内容？
<a href="test.pdf">テスト用PDF</a>
<br>
<br>
<img src="icon5.gif" width="130" height="55" border="0"><br>画像5の内容？
<a href="test.pdf">テスト用PDF</a>
</p>
</div>
</body>
</html>
--------------------------------------------------------------
(リンク先のpdfファイルのURLがこちらの環境になっていました。)
クラス名「current」を「icon2.gif」～「icon5.gif」の内容を表示するボックス要素にも付与しているのが原因です。
それから、pdfファイルを表示するiframeが追加されていませんし、リンクにターゲットも指定されていませんでした。
jQueryも追加していない為、前に表示したpdfの内容がそのまま残る状態でした。
以下のように変更して確認してみてください。(CSSは任意で追加してください。)
※pdfファイルへのリンクがなぜか2つずつになっていますが、そのままにしています。
※他、ブラウザで自動解釈して表示には影響ないようですが、閉じタグのないpタグも修正してあります。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="GENERATOR" content="JustSystems Homepage Builder Version 19.0.0.1 Trial for Windows">
<style>
<!--
#content-box .info{
display: none;
}
#content-box .current{
display: block;
}
#menu .menu-ico,
#seating-plan td{
cursor: pointer;
}
#menu{
margin-bottom: 100px; /* ここで好きな数値を指定*/
}
[href$=".pdf"]{
background: url(pdf.gif) no-repeat 100% 50%;
}
* html a.pdf{
background: url(pdf.gif) no-repeat 100% 50%;
}
-->
</style>
<script src="jquery-1.11.1.min.js"></script>
<script>
$(function(){
$( "#menu .menu-ico" ).click(function() {
var imgid = $( this ).index();
$("#content-box .info").hide();
$("#content-box .info").eq(imgid).show();
$("#content-box #pdffile").hide(); //この行を追加
});
// ここから追加
$( "#content-box .info a" ).click(function() {
$( "#content-box #pdffile" ).show();
});
// ここまで追加
});
</script>
<title>営業部</title>
</head>
<body>
<p style="font-size : medium;"><b><i><font SIZE="5">営業部<br>
営業部のホームページへようこそ！！</font></i></b><br>
</p>
<div id="menu">
<img src="icon1.gif" width="130" height="55" border="0" class="menu-ico">
<img src="icon2.gif" width="130" height="55" border="0" class="menu-ico">
<img src="icon3.gif" width="130" height="55" border="0" class="menu-ico">
<img src="icon4.gif" width="130" height="55" border="0" class="menu-ico">
<img src="icon5.gif" width="130" height="55" border="0" class="menu-ico">
</div>
<div id="content-box">
<p class="info current">
<img src="icon1.gif" width="130" height="55" border="0"><br>画像1の内容？
<a href="test.pdf" target="pdffile">テスト用PDF</a>
<br>
<br>
<img src="icon1.gif" width="130" height="55" border="0"><br>画像1の内容？
<a href="test.pdf" target="pdffile">テスト用PDF</a>
</p>
<p class="info">
<img src="icon2.gif" width="130" height="55" border="0"><br>画像2の内容？
<a href="test.pdf" target="pdffile">テスト用PDF</a>
<br>
<br>
<img src="icon2.gif" width="130" height="55" border="0"><br>画像2の内容？
<a href="test.pdf" target="pdffile">テスト用PDF</a>
</p>
<p class="info">
<img src="icon3.gif" width="130" height="55" border="0"><br>画像3の内容？
<a href="test.pdf" target="pdffile">テスト用PDF</a>
<br>
<br>
<img src="icon3.gif" width="130" height="55" border="0"><br>画像3の内容？
<a href="test.pdf" target="pdffile">テスト用PDF</a>
</p>
<p class="info">
<img src="icon4.gif" width="130" height="55" border="0"><br>画像4の内容？
<a href="test.pdf" target="pdffile">テスト用PDF</a>
<br>
<br>
<img src="icon4.gif" width="130" height="55" border="0"><br>画像4の内容？
<a href="test.pdf" target="pdffile">テスト用PDF</a>
</p>
<p class="info">
<img src="icon5.gif" width="130" height="55" border="0"><br>画像5の内容？
<a href="test.pdf" target="pdffile">テスト用PDF</a>
<br>
<br>
<img src="icon5.gif" width="130" height="55" border="0"><br>画像5の内容？
<a href="test.pdf" target="pdffile">テスト用PDF</a>
</p>
<iframe name="pdffile" id="pdffile"></iframe>
</div>
</body>
</html>
ポイントの送付で、ご勘弁願います。
本当に、ここまで、ありがとうございました。
＃今日の夕方まで、、、回答できるとおもってのに・・・
ポイント付きメッセージで返信すると、届くのにしばらくかかるので、こちらでコメントします。
＞私も、土、日、図書館でjQuryとcssの勉強（入門編）を読んでたのですが、、、、、
＞雰囲気を感じたぐらいです。a-kuma3さまは、どのようにして、身につけられたのでしょうか。
＞私も、勉強の仕方が悪いと思います。すいません、アドバイスいただければ、大変助かります。
覚えることが多いですから、一朝一夕で使えるようになるのは難しいと思います。
ぼくは随分と昔からプログラムをいじっています。
新しいプログラム言語を覚えるときには、まるまる違ったもの、ということは、そうはないので、新しく覚えることが少しで済みます。
jQuery を知る前に、javascript は大体わかっていたし、prototype.js というライブラリを使っていたので、モダンな書き方にも馴染みがありましたので。
とは言っても、全てを分かってるわけではありません。
良いとこ、半分くらいだと思ってます。
今は、プログラムを動かす環境が簡単に手に入るので、動かしてみるのが一番早いかなあ、と思います。
小さく作って、シンプルに動作を確認する。
大きなものも、小さなものの組み合わせですから。
最初は、呪文として覚えるのでも構わないと思います。
rouge_2008 さんがコメントしたコードの jQuery の部分は短いので、それぞれの行が何をやっている、という辺りを理解するところから、ぼちぼちとやっていけば良いと思います。
後は、マニュアルを読むことを意識することでしょうか。
入門書やネットの情報もたくさんあるので、どれが正しいのかよく分かりません :-)
基本は、本家に当たる、だと思います。
何となく分かってきてから、で、良いと思いますけど。
＞あと、すいません、Operaでアクロバットリーダーが期限切れとでてPDFが開かないです。。。。
＞アドオンをいれたのですが、、、ここ別に質問を立てた方がいいでしょうか。。。
アドオンって、いつインストールしました？
インストールしてからアップデートって、やってますか？
http://ja.opera-wiki.com/%E3%83%97%E3%83%A9%E3%82%B0%E3%82%A4%E3%83%B3
Opera の Adobe Reader のバージョンを確認しましょう。
最新は、11.0.10 みたいです。
http://get.adobe.com/jp/reader/
もし、古かったら、アドオンをアップデートしましょう。
Operaは、http://get.adobe.com/jp/reader/で解決しました。
アドオンのインストールは、
https://addons.opera.com/ja/extensions/details/pdf-viewer/?display=en&reports
でしました。
すいません、PDFを２行にしたかった理由は、いくつも画像とリンクをいれてどうなるか。
おしえていただきたかったからです。
まだ、上司から社内HPをつくってくれと言われてないのですが・・・・どうしても
自分で、前もって準備したかったのです。。。
そしたら、、職場でどうどうと勉強できると思ったからです。
（そもそも年内に、依頼があるのか、、あやしいです）
じつは、ビルダーの使い方を知り合いに教える予定がはいっています。
来年の２月以降ですけど、、、なんとか無料の場所でお知られないかとなやんでいます。
自分の会社のハジをさらすようですけど、、、Wifiをつかえるところで
一度は無料でできたのですが・・・二度目からは、いすぎだと、言い方は悪いですが・・
追い出されました。
まずは、rouge_2008さまのソースの理解からなんとか・・・・始めてみます。
（100年ぐらいかかるかもしれない：笑）
でも、いまは、職場では、できない状況です。
--------------------------------------------------------------------------
今は、プログラムを動かす環境が簡単に手に入るので、動かしてみるのが一番早いかなあ、と思います。
小さく作って、シンプルに動作を確認する。 大きなものも、小さなものの組み合わせですから。
--------------------------------------------------------------------------
後は、↑ですね。。。。入門書にもサンプルがあったのですが、、、とりあえずは
うってみてば、よかったですね。。。
a-kumaさまのHPも、大好評です。。。。いつもネットでおしえてもらって自力では、
できなかったと、言ってるのですが・・・すごいと言われています。
一度、鹿児島 のキーワードで検索で一番上にでないか・・・と言われたことが
ありますが・・・お金をかけない限り無理です。。。と私は判断しているのですが・・
（そこでは、そうといわなかったのですが）
たぶんフェイスブックのいいねを、お金を払っていっぱい、クリックしてもらうと
ヒットがあがるのでは、ないのかとおもってるのですが・・・・
なんせ、非営利団体なので、、、お金のだしようがないです。。。
あとは、慶応義塾大学からリンクをはってもらったら、最高なのですけど・・・
a-kumaさまのソースも理解するように、努力します。
rouge_2008さまのご意見も、急ぎでは、ないのですが・・聞きたいです。
実は、わたしは、勉強は、朝か夕方にしかできない状況です。
朝からPCを、触っていると、うちの奥さんにおこられます。（前は、朝できたのですが・・）
図書館の本も２冊かりたんですが・・・２０日には、いったん返さないと
いけないです。あれば、またかります。
まだ、座席表もあきらめてません。。。。またやりたいと思います。
あと、うちに犬がいますので、そのうち、今度は、自力でその犬のHPを立ち上げたいと
思います。
このあと、予定が入っていますので（いつもですが・・すいません）
今日は、ここまでです。。。。長文で申し訳ありませんでした。
返信が遅くなりましたが、私も受け取りました。(a-kuma3さん、いつも反応早いですね・・・)
私はまだ身につけてはいないのですが、a-kuma3さんも書いているように、その都度サンプルを実際に試して、動作を確認すると理解しやすくなると思います。
本の他にドキュメントも確認してみてください。
すぐには使わなくても、どんな事ができるのかが何となく分かればいいと思います。
日本語で読むと分かりやすいと思いますので、以前から参考にしているサイトと少し前に見つけたサイトの2つを一応紹介します。
・jQuery日本語リファレンス
http://semooh.jp/jquery/
※こちらは以前から利用していますが、よく知られているサイトではないかと思います。
・jQuery API Documentation 日本語訳
http://s3pw.com/jQ-JPN/
※比較的新しいバージョンに対応しています。
※公式のドキュメントを確認するのは必須だと思いますので、翻訳して比較しながら読んでみてください。
・jQuery API Documentation
http://api.jquery.com/
> PDFを２行にしたかった理由は、いくつも画像とリンクをいれてどうなるか。
> おしえていただきたかったからです。
動作を確認できたようですのでおそらく分かったと思いますが、ターゲット「target="???"」に同じフレーム名を指定してあれば、同じフレーム内に表示されます。
> たぶんフェイスブックのいいねを、お金を払っていっぱい、クリックしてもらうと
> ヒットがあがるのでは、ないのかとおもってるのですが・・・・
怪しい業者がやっているようですが、やめておいた方がいいと思います。
＞自分で、前もって準備したかったのです。。。
＞そしたら、、職場でどうどうと勉強できると思ったからです。
あー、これ、分かります。
もう、随分と昔の話ですけど、社内パッケージの焼き直しの仕事が舞い込んできそうなときに、c++ が面白くて仕方無かったときだったので、「これからは、オブジェクト指向だぜ！」とか言って、わがままを通しちゃったことがあります。
しなくて良かったかもしれない苦労もしたけど、とても楽しかった。
＞一度、鹿児島 のキーワードで検索で一番上にでないか・・・と言われたことが
＞ありますが・・・お金をかけない限り無理です。。。と私は判断しているのですが・・
鹿児島は、新体操以外に有名なものがいっぱいありますからね :-)
でも、「鹿児島 新体操」でググると30位くらい。
「鹿児島 新体操クラブ」でググると...
rouge_2008 さんも書いてますが、業者は眉に唾をつけておくくらいでちょうど良いです。
業者って言うくらいですから、お客さんはひとりやふたりではないです。
何百人、何千人ってお客さんがみんなバラバラのキーワードを持ち寄るわけはないですから、全部を検索結果のトップにするなんて、土台無理な相談です。
http://semooh.jp/jquery/
↑をみて、早速、本がでてましたので買いました。。。。。。
＃これで、年末、年始の勉強が見えてきました。。。直感ですが、わたしでもできそうな
本だと思います。
正月の実家では、ネット環境がないものですから・・・本がよかったのです。
中古でしたので、500円でした。。。。
（なんとか、おこづかいからやりくりします）
動作を確認できたようですのでおそらく分かったと思いますが、ターゲット「target="???"」に
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
同じフレーム名を指定してあれば、同じフレーム内に表示されます。
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
↑、10分ぐらい（も？）考えて、わかりました。ありがとうございます。
実は、社内のHP（フレームの入れ子）に、別の組織のページがあります。
上司からは、まだ、始めてくれとは、いわれてないのですが、このページを
見たときに、死ぬほど詳しい方か・外注だと思いました。
今後、そのうち私がアップすると思いますが、hatenaでおしえてもらったとは、
死んでも言わないです。（ネットでおしえてもらった（つくってもらった）とは言いますが・・・）
いうと、どう相手からとられるか、わからないからです。
一部の方は、私がはてなユーザだと知ってますが・・大丈夫です。
ジャストシステムへの、問い合わせは、２回までが無料ですので、また、つまづいた
ときには、どうか、皆様のお力をお借りしたいと思います。
よろしくお願いします。m(_ _)m
フェイスブックでは、情報をありがとうございました。。。。やめます。
a-kumaさまのHPの今度の更新は、21日以降です。＃大会は、７日だったのに・・・
＃のんびりしてますね・・・すいません、愚痴で・・・
＃社内の業務改善のノルマが、一人一件あるのですが・・・わたしは、座席表か
問い合わせフォームで、あげるつもりです。。
もう、ビルダーの期限が切れますので、今後は、GIMPで画像を勉強します。。
＃今回のは、ビルダーの機能は、まったくといっていいほどつかってないですね。。。
10年ぐらい前HPをつくる仕事をしてたのですが、いまと比べると超かわりました。。。
当時は、javascriptを勉強したかったのですが・・なぜか、できなかった。。。？
イラストレーター（すいません、カタカナで）までは、挑戦できたのですが、、、
もう、そろそろ、わたしのスイッチが切れそうなので・・・これで、終わります。
長文を読んでいただき、ありがとうございました。m(_ _)m
知り合いの方へのビルダーの無料での、教え方は、また考えてみます。。
＃なんで、こんな長文になるんだろう。。。
実は、昨日CSSの、図書館で借りた本を,PCで打ってやってたのですが、、、
一ページ目でまったく、うごかなかったです。。。。HTMLチェッカーで、あれこれ、やってる
うちに、つかれました。。。。
これから、やっと、jQueryの勉強ができます。ありがとうございます。
まずは、意味は、わからなくても、PCで打ってみることから始めたいとおもいますが、、
勉強のやりかたが、まちがってるでしょうか。。。
昨日、一つのプラグイン （画像を水面に映す）が、本だけではできず。
ネットで調べて、やっと、うごきました。。。。自力でやれてうれしかったです。
１ページだけですが、他にもプラグインを試してみてやってみます。