HTMLが理解できるようになったので、JavaScriptをいろいろなサイトで研究しましたが、どうしても習得できません。サンプルを真似して作成しても中身の意味が把握できないんです。どうしたら上達するのでしょうか?研究して1年程です。プログラミングは他には勉強したことがありません。よろしくお願い致します。

このQ&Aに関連する最新のQ&A

A 回答 (1件)

JavaScript初心者の経験談です。


初めは、フリーソースを入手しても何のアレンジもできませんでした。
で、私にとっての最初のブレークスルーは、「上位object→下位object
→property」の関係が、HTMLの「タグ→属性」の関係と似ていると
感じたことです。windowとdocumentをピリオドで繋ぐ関係と、<A>の
< >の中に HREF="xxx"を入れ込む関係・・・ 似てると思いません?

次は、拝借した先達のソースを、辞書を片手に翻訳?すること。
参考書を通読するのは辛いですが、自分が使いたいソースを解読する
のは楽しく、ささやかな達成感が得られました。
私は、HTML以来、技術評論社の「ポケットリファレンス」シリーズを
愛用しており、最近はJavaScriptも怪しいのに、CGI&Perl版にも
手を出してます。

あと、このサイトでも、質問者様に失礼をお詫びしつつ、演習問題
のつもりで「経験者・自信なし」の回答をさせていただいています。
    • good
    • 0
この回答へのお礼

loveoboさん、おはようございます。ご回答ありがとう!!なかなか前進できない自分にいらだっていましたが、回答を頂いてとってもうれしいです。確かにHTMLのタグと似ていますね。お互いにがんばりましょう

お礼日時:2002/04/02 08:50

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aと関連する良く見られている質問

QJavascriptのお勧めサンプルサイト

いつもお世話になっております。
私は最近Javascriptに興味を持ち、勉強しております。WEB制作に活かしたいと考えております。
一見シンプルに見えるけれど動的な要素で印象付けられるサイトをつくりたいと考えております。
お勧めのサンプルサイトがあれば教えて頂きたいと思います。
皆様宜しくお願い致します。

Aベストアンサー

『OpenSpace』
http://www.openspc2.org/
基礎から高度なテクニックまで、充実しています。

QJavaScriptでスライドショー。サンプル

JavaScriptでスライドショー。サンプルありませんか

JavaScript、もしくは(FLASHなどの)アドオンが必要ない何らかの手段でスライドショー的なモノを作りたいです。


例えばYahoo!ニュースの写真付きの記事
http://headlines.yahoo.co.jp/hl?a=20111101-00000010-rps-soci.view-000
真ん中に写真があり、左右にボタンが付いていて、押せば前や次に移動できる。

こういうヤツのサンプルがあれば紹介して下さい。

要件は以下です。
・真ん中に写真があり、左右にボタンが付いていて、押せば前や次に移動できる。
・写真をクリックするとURLにジャンプする。
・できるだけスタイリッシュ。
・無料
以下の機能があればなお嬉しいです。
・自動的にスクロールする機能がある。


以上、宜しくお願いします。

Aベストアンサー

検索すれば、サンプルは山ほど見つかると思います。
ライブラリ化されているものも沢山作られていると思いますし、オプションも設定できるようになっているものなど種々様々です。

>何らかの手段でスライドショー的なモノを作りたいです。
自作するのが目的なのか、使うのが目的なのかどちらでしょうか。

自作ならいくつかのサンプルを見て、参考にしながら作るのがよいかも。
当然ながら、要求条件を満たしたものにできることでしょう。
使いたいだけなら、検索していろいろ試して良さそうなものを探せばよろしいかと。
(リンク機能付きのものがあるかどうかは不明)


以下、適当に検索して引っかかったもの
http://www.geocities.jp/miyake_kobo/js/index.html
http://acidjs.wemakesites.net/pages/image-slider-js/demo/
http://demos.flesler.com/jquery/scrollShow/
http://www.agilecarousel.com/
http://www.electricprism.com/aeron/slideshow/
http://wowslider.com/demo.html?affid=331J-S9
http://malsup.com/jquery/cycle/
http://www.gmarwaha.com/jquery/jcarousellite/
http://www.twospy.com/galleriffic/index.html
http://www.ezjquery.com/cgi-bin/webapp.rb?r=access#
http://www.skuare.net/test/jGallery.html
http://visuallightbox.com/lightbox-mac-style-demo.html?affid=1127
http://www.tomhoppe.com/index.php/2008/05/vir-al-fairer-double-sarrc/

検索すれば、サンプルは山ほど見つかると思います。
ライブラリ化されているものも沢山作られていると思いますし、オプションも設定できるようになっているものなど種々様々です。

>何らかの手段でスライドショー的なモノを作りたいです。
自作するのが目的なのか、使うのが目的なのかどちらでしょうか。

自作ならいくつかのサンプルを見て、参考にしながら作るのがよいかも。
当然ながら、要求条件を満たしたものにできることでしょう。
使いたいだけなら、検索していろいろ試して良さそうなものを探せばよろ...続きを読む

Qjavascriptの円形画像ギャラリーのサンプル

こんにちは、現在ホームページを作ろうと思っていて
1点javascriptによる実装を考えております。

http://www.flashmo.com/preview/flashmo_098_3d_curve_wall
がイメージに近いのですが、これだとflashなので、
これに似たjavascriptを探しております。
(・ドラッグとかでスピードが変わらなくてもよく、
  単にゆっくり回転している物を探しております。
 ・単に画像ギャラリーのsliderを少し円形(3D)にしたものを
  探しております。)

なにか情報がございましたら
どんな情報でも良いので、ご相談させてくださいませ。

失礼致します。

Aベストアンサー

 function sinIntDeg (n) {
  return bufSin [n % 360 |0];
 }
 

 function cosIntDeg (n) {
  return bufCos [n % 360 |0];
 }
 
 
 function aryToFixedString (ary) {
  return ary.map (function (a) { return a.toFixed (10); } ).join (',');
 }
 

 function Tile (image, distance, angle, scale, offsetHeight) {
  this.image = image;
  this.distance = distance;
  this.angle = angle;
  this.scale = scale;
  this.offsetHeight = offsetHeight;
  this.position = {};
  this.rotate ();
 }


 function TileRotateY (stepAngle) {
  var a = this.angle += stepAngle || 0;
  var r = this.distance;
  
  this.position = {
   x: sinIntDeg (a) * r,
   y: this.offsetHeight,
   z: cosIntDeg (a) * r
  };
  
  return this;
 }
 
 
 function TileCreate (image, distance, angle, scale, offsetHeight) {
  if (arguments.length < 2)
   throw new Error;
  
  return new Tile (
   image,
   distance || 100,
   angle || 0,
   scale || 1,
   offsetHeight || 0
  );
 }
 

 Tile.prototype.rotate = TileRotateY;
 Tile.create = TileCreate;
 
 //________________________
 
 function FloorMember (member, angle, step) {
  this.member = member;
  this.angle = angle;
  this.step = step;
  this.timerId = null;
 }
 
 
 function FloorMemberRotate () {
  this.angle += this.step;
  
  this.member.forEach (function (tile) {
   var p = tile.rotate (this.step).position;
   var sin = sinIntDeg (tile.angle);
   var cos = cosIntDeg (tile.angle);
   var ary = [
    tile.scale * cos,       0,        -sin,      0,
            0,  tile.scale,         0,      0,
           sin,       0,  tile.scale * cos,      0,
           p.x,      p.y,        p.z,      1
   ];

   tile.image.style['-webkit-transform'] = 'matrix3d('+ aryToFixedString (ary)+')';
  }, this);
 }
 
 
 function FloorMemberStart () {
  var that = this;
  var func = function () { that.rotate (); };
  if (! this.timerId) {
   this.timerId = setInterval (func, 30);
  }
 }
 
 
 function FloorMemberCreate (images, radius, offsetFloor, step) {
  if (arguments.length < 2)
   throw new Error;
  
  var member = [];
  var imgs = Array.prototype.slice.call (images, 0);
  var len = imgs.length;
  var side = int (radius * 2 * Math.tan (Math.PI / len) + 0.5);
  var img;
  var aspectRatio = parseInt (imgs[0].height, 10) / parseInt (imgs[0].width, 10);
  var height = int (side * aspectRatio + 0.5);
  var offsetHeight = (offsetFloor || 0) * height;
  var n = 360 / len;

  for (var i = 0; i < len; i++) {
   img = imgs[i];
   img.width = String (side);
   img.height = String (height);
   member.push (new Tile (img, radius, n * i, 1, offsetHeight));
  }
  
  return new FloorMember (member, 0, step || 1);
 }
 
 
 FloorMember.prototype.start = FloorMemberStart;
 FloorMember.prototype.rotate = FloorMemberRotate;
 FloorMember.create = FloorMemberCreate;
 
 this.FloorMember = FloorMember;
}) ();


FloorMember.create (document.querySelectorAll ('#screen img[alt="f0"]'), 1000, 0, 1).start ();
FloorMember.create (document.querySelectorAll ('#screen img[alt="f1"]'), 1000, 1, 2).start ();
FloorMember.create (document.querySelectorAll ('#screen img[alt="f2"]'), 1000, 2, 3).start ();

</script>

ipad2 で、うごかしてみました。 そこそこ速くうごきますよ!

 function sinIntDeg (n) {
  return bufSin [n % 360 |0];
 }
 

 function cosIntDeg (n) {
  return bufCos [n % 360 |0];
 }
 
 
 function aryToFixedString (ary) {
  return ary.map (function (a) { return a.toFixed (10); } ).join (',');
 }
 

 function Tile (image, distance, angle, scale, offsetHeight) {
  this.image = image;
  this.distance = distance;
  this.angle = angle;
  this.scale = scale;
  this.offsetHeight = offsetHeight;
  this.position =...続きを読む

Qページ全体の拡大/縮小が行える、JavaScriptのサンプルを教えていただけますでしょうか?

ページ全体の拡大/縮小をJavaScriptにて行いないたい(対象はIEのみ)のですが、検索をしてみると、「文字サイズの拡大/縮小」や「画像の拡大/縮小」はよく見つかるのですが、ページ全体の拡大/縮小のサンプルを掲載しているページはあまり見かけません。

検索("ページ ズーム javascript"等のキーワードで)で何件か見つかって、試してはみたのですが、それらのプログラムですと、私のほうのHTML+CSSで使用すると、何とも説明しがたいおかしな挙動をしてしまいます。HTML+CSSの見直しも色々行ってみたのですが、なかなか改善されません。

みなさんがご存知のJavaScriptのサンプル(ページ全体の拡大/縮小)が掲載されているURLを教えていただけますでしょうか?
教えていただいたサンプルを実装し、色々探ってみたいと思っています。

※ちなみに、イメージは↓このような感じです。
http://appleworld.com/4tr/

Aベストアンサー

「zoomプロパティ IE バグ」をキーワードに検索してみたんですが、
結構不具合が報告されてます。
 特にIE7からIE8に変わった時に大きく変わったみたいです。
http://blog.webcreativepark.net/2009/03/30-125731.html

※もともとIEの機能で、仕組みの詳細はマイクロソフトの企業機密
だとか、。。。(本当かしら?)

QJavaScriptからJavaScriptを呼ぶ方法?

あるJavaScriptのファイルでで変数に値を代入します。
他の複数のJavaScriptのファイルで、その変数を使用したいと思います。
JavaScript{
    JavaScript{
    }
    処理・・・・
}
という形になるのでしょうか。
このように、他のJavaScriptから変数を呼び出したいのです。
どのように記述したら良いでしょうか?

Aベストアンサー

関数内で明示的に定義した変数(ローカル変数)でなければ、どこからでも自由に参照,更新できます。
ただ、逆にどこでも自由という処が危険であり誤動作の元なので、
参照用(値の引き渡し用)の変数を1つ用意する事をお勧めします。


まず変数の有効範囲ですが、
関数の外で明示的に定義された変数とか
明示的に定義せずに使用している変数などは、
グローバル変数と言われ
少なくとも同一ファイル内では自由に参照,更新できます。
位置的には、window.self.変数 となります。
そして JavaScript の外部ファイルは HTML のファイルから呼ばれて読み込まれて動作するので、
特別な指定をしない限り
HTML ファイル上にて JavaScript は実行されます。

よって、どこの外部ファイルに書かれていようとも
グローバル変数はどこでも自由に参照,更新ができます。
(故に、名称の重複にも要注意。)

それから、関数の中で明示的に定義している
ローカル変数を
もしどこでも使いたいと考えた場合は「無理」という答えになります。
これはその関数でのみ参照,更新が可能で、
何よりその関数が動作(呼ばれて)していない時の変数の内容が保障されていません。


あとおまけで、HTML 自体が別々(例えばフレームとかの別フレーム)でもそのフレーム名を用いてとかで
(セキュリティーで引っかからなければという前提で)参照,更新が可能な場合もあります。

関数内で明示的に定義した変数(ローカル変数)でなければ、どこからでも自由に参照,更新できます。
ただ、逆にどこでも自由という処が危険であり誤動作の元なので、
参照用(値の引き渡し用)の変数を1つ用意する事をお勧めします。


まず変数の有効範囲ですが、
関数の外で明示的に定義された変数とか
明示的に定義せずに使用している変数などは、
グローバル変数と言われ
少なくとも同一ファイル内では自由に参照,更新できます。
位置的には、window.self.変数 となります。
そして JavaScript ...続きを読む


人気Q&Aランキング

おすすめ情報