• 締切済み

画像の拡大・縮小機能のサンプルページを探しています

参考:http://www.maimu.co.jp/753/detail/7302106.php 上記サイトのような画像を拡大・縮小出来るスライダーがついていて、 且つ拡大した際にマウスで移動できる機能を実装したいと思っているのですが、 何か解説ページなどありませんでしょうか? Flashでは無く、javascriptで実装できればと思っております。 ポイントとしては、 ◎「+」「-」ボタンだけではなく、スライダーで拡大・縮小ができる ◎拡大時にはマウスで拡大位置を移動できる ◎Flashではなく、javascript(jQueryとか?)で。 ご存知の方がいらっしゃいましたらお願いいたします。

みんなの回答

  • abacabu
  • ベストアンサー率37% (250/663)
回答No.2

他に回答も無い様ですので再度書き込みします。 基本的にjQueryは誰かが作ったJavaScript系プログラムを使用フリーにして公開しているライブラリです。 誰が使おうが問題なし、(使った事がなく多少規約が有るでしょうが) jQueryのサイトでそれこそライブラリの中から似たようなプログラムを探して、 使うか、他人のプログラムを利用したくない場合はそのjQueryのプログラムを参考にして +αして作るとか。 何にせよjQueryと名の付くものはフリープログラムですのでご自由に配布元からダウンロードしてお使い下さい。

  • abacabu
  • ベストアンサー率37% (250/663)
回答No.1

趣味でWEBページを作成している者です。 ご質問の参考サイト拝見しましたが、ソースみました?? ふつうにプログラムそのまま貼ってあったのでまず真似してみてはどうですか? プログラムでしたし。 全く回答になって無くてすいません。 あとちなみにソース色々見る方法を書いておきます。 IEの場合ですが、画面上部に「ツール」というのがあると思うのですが、 これを押してもらって、その中に「開発者ツール」があるので押して下さい。 別画面でその際とのCSS(外部でも見れます)HTMLを見る事ができます 恐らくリンク貼られている外部ファイルプログラムは全て見れると思います。

bonbon_bon
質問者

お礼

回答ありがとうございました。 ソースはもちろん質問前に確認しました。 私も趣味レベルでやっているのですが、 勉強の為に(もちろん勉強もさせていただきますが)というよりは 公開するページに実装したいなと考えています。 趣味レベルとはいえ公開する以上パクるのはマズイと思いますので、 ライセンス的に問題のない、何か同じような機能のサンプルや解説ページがないかと思い、質問させていただきました。 もし他にも情報お持ちでしたらご協力お願いいたします。

関連するQ&A

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

    ページ全体の拡大/縮小をJavaScriptにて行いないたい(対象はIEのみ)のですが、検索をしてみると、「文字サイズの拡大/縮小」や「画像の拡大/縮小」はよく見つかるのですが、ページ全体の拡大/縮小のサンプルを掲載しているページはあまり見かけません。 検索("ページ ズーム javascript"等のキーワードで)で何件か見つかって、試してはみたのですが、それらのプログラムですと、私のほうのHTML+CSSで使用すると、何とも説明しがたいおかしな挙動をしてしまいます。HTML+CSSの見直しも色々行ってみたのですが、なかなか改善されません。 みなさんがご存知のJavaScriptのサンプル(ページ全体の拡大/縮小)が掲載されているURLを教えていただけますでしょうか? 教えていただいたサンプルを実装し、色々探ってみたいと思っています。 ※ちなみに、イメージは↓このような感じです。 http://appleworld.com/4tr/

  • jsでマウスオーバー時に画像拡大、変更、縮小したい

    javascriptを使用し、 画像をマウスオーバーした時に拡大させ、 拡大しきった時に画像を変更、 マウスアウトすると再度元の画像に戻り、 縮小して元すべて通りになる、 という機能を実装したいのですが、 ご指導頂けますでしょうか。 (ブラウザはIE6を使用しています) 宜しくお願い致します。

  • iPhone/iPad向けWebサイトで、画像のみの拡大縮小を行う

    iPhone/iPad向けWebサイトで、画像のみの拡大縮小を行う iPad向けにWebアプリを開発しています。 HTMLのページ内に埋め込まれた画像のみをgoogleマップのような感じに拡大・縮小・表示範囲の移動などを、iPadのUI(つまむ・なぞるetc)で行えるjavascriptないしAJAXのコード、もしくはライブラリを探しています。 PC向けのライブラリはjavascriptでもFlashでもいろいろあるようですが、どなたかご存知であれば教えていただけると非常に助かります。

  • Googlemapのように画像を拡大・縮小・移動

    画像をダブルクリック+UIで拡大・縮小でき、マウスでドラッグ移動できるJSライブラリを探しています。 Googlemapのような感じです。 なるべく直感的に操作できるものがいいです。 http://wayfarerweb.com/jquery/plugins/mapbox/ ダブルクリックでズームしたい。拡大時の動きがちょっとカクカク。 http://phpspot.org/blog/archives/2010/08/urlgooglezoomit.html こういったのが理想ですが、左下にサービスのロゴが出てしまうのでこちらは使えません。 ご存知の方、ぜひ教えてください。 よろしくお願いいたします。

  • JWCAD画面での拡大縮小について

    4月からJWCADを使い始めましたが、マウスの右左クリックを使っての拡大縮小作業になかなか慣れません。AutoCADのように、マウスのコロコロ(名称がわからないのですが・・・)を使って簡単に拡大縮小したり、自分の見たい部分に移動する方法はないでしょうか?

  • つまらない質問なのですが、IEの拡大縮小について、、

    IEの拡大・縮小について、、、(IE.6) 教えてください。 パソコンを使い始めて2年余り。。。 あまり、操作も詳しくないのに、firefoxを使い始めました。 firefoxには、アドオンで、拡大縮小のボタンがあり、ツールバーに、 置いています。 そして、最近気付いたのですが、IEに、 【拡大縮小のボタン】を発見!!⇒(ツールバーに、AAのボタンがありますよね??) 笑われそうですが、今までは、メニューバーから、拡大縮小、 もしくは、ctrlキーのマウスのホイールでやっていたもので、、、 こういう【ボタン】の存在に気付きませんでした。 それで、みなさんにお聞きしたいのですが。 パソコンデビュー(IE)のとき、 どのくらいで、このAAの存在に気付きましたか?? なんか、今まで損していたような、、、、 みなさん、よろしくお願いします。

  • ペンタブ Photoshop 拡大縮小

     こんにちは,ペンタブ初心者です. wacomのintuos4というペンタブを買ったのですが. Photoshopでの拡大縮小は今までは Alt+マウスホイール でマウスの位置に向かって 倍率100%→110%→121%→133%→・・・ というように少しずつ拡大(縮小)する便利な機能を使っていたのですが.  ペンタブのタッチホイールの設定のズーム機能では 画面の中心に向かって しかも 倍率100%→200%→300% と大雑把に拡大(縮小)してしまいます. これはおそらくペンタブのタッチホイールに Ctrl+[+],Ctrl+[-]というキーストロークが割り当てられているだけなのだと思います.  ペンタブの操作に ポインタの位置に向かって少しずつ拡大のような操作(Alt+マウスホイール) をさせたいのですが,どうにかなりませんでしょうか.  また,それが無理だとしたら,この操作に近いようなキーストロークなどがありましたら教えていただきたいです. (Ctlr+Space+クリック などは知っていますが倍率が大雑把です.) よろしくお願いします.

  • イラストレータ 拡大縮小を… 初心者です…

    イラストレータ CS (Win)を使い始めました。 テキストを打ったあと、マウスで拡大・縮小をしたいのですが 「移動」にしかなりません。 以前使っていた10では入力したテキストの周りに四角が出てきて、 それをドラッグしながら拡大・縮小が出来たと思ったんですが。 多分なにかを押してしまってその「四角」の機能を消しているんだと思います。 どなたかお教え下さい。

  • イラストレーターCS2での、拡大・縮小のやり方

    イラストレーターのCS2(windows)を使用しています。 オブジェクト・画像の拡大・縮小をする時、まずShiftを押しながらマウス左クリックをドラッグしてオブジェクトの端のポイントを動かせばできていたのですが、どこか設定を触ってしまったらしく、できなくなってしまいました。 今まで通り、画像やオブジェクトをマウスで拡大・縮小するには、どうしたらいいのかお教えください。 よろしくお願い致します。

  • 【α5100】画像再生で拡大・縮小する方法

    先日α5100のパワーズームレンズキットを新品で購入しました。 「メニュー→再生→拡大」の画面で、画像の拡大・縮小がしたいのですが、 公式ヘルプにある >拡大したい画像を表示して、T側にW/T(ズーム)レバーを動かす。 >拡大しすぎた場合は、W側にW/T(ズーム)レバーを動かして倍率を調整してください。 この操作をしても拡大・縮小されません。 最初の拡大表示の倍率のまま固定されて、見たいポイントの移動の操作しか出来ません。 どうすればよいのでしょうか。 ご教授願います。 ※OKWAVEより補足:「ソニー製品」についての質問です。