のくす牧場
コンテンツ
牧場内検索
カウンタ
総計:127,062,854人
昨日:no data人
今日:
最近の注目
人気の最安値情報

    私的良スレ書庫

    不明な単語は2ch用語を / 要望・削除依頼は掲示板へ。不適切な画像報告もこちらへどうぞ。 / 管理情報はtwitter
    ログインするとレス評価できます。 登録ユーザには一部の画像が表示されますので、問題のある画像や記述を含むレスに「禁」ボタンを押してください。

    元スレ[JavaScript]プログラム作成します

    JavaScript スレッド一覧へ / JavaScript とは? / 携帯版 / dat(gz)で取得 / トップメニュー
    スレッド評価: スレッド評価について
    みんなの評価 :
    タグ : 追加: タグについて ※前スレ・次スレは、スレ番号だけ登録。駄スレにはタグつけず、スレ評価を。荒らしタグにはタグで対抗せず、タグ減点を。
    レスフィルター : (試験中)
    ←前へ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 次へ→ / 要望・削除依頼は掲示板へ / 管理情報はtwitter
    901 : Name_Not - 2010/09/25(土) 13:40:25 ID:??? (+55,+27,-20)
    1つのウインドウでそれだけのメモリを使用することを許可しているブラウザってあるのか?
    902 : Name_Not - 2010/09/25(土) 13:50:51 ID:??? (+51,+23,-20)
    30GBぐらいHDDに保存だからクソみたいにガリガリいいそうだな。
    903 : Name_Not - 2010/09/26(日) 02:44:49 ID:??? (+4,-23,-7)
    894は、とりあえず、100Mのファイルをメモ帳で開いてみるべき
    904 : Name_Not - 2010/09/27(月) 17:02:12 ID:??? (+32,+20,-35)
    JavaScriptにてお願いします。

    最初に基準として
     2010年9月28日9時
    と表示していて、その日時を過ぎると36時間後の
     2010年9月29日21時
    を表示。また過ぎると次の36時間後
     2010年10月1日9時

    このように表示時間に現在日時が到達すると
    36時間後の日時を繰り返し表示するものができますでしょうか。

    何卒宜しくお願い致します。
    905 : Name_Not - 2010/09/27(月) 17:32:46 ID:??? (+52,+29,-5)
    余裕でできるけど、今眠いからパス。
    906 : Name_Not - 2010/09/27(月) 19:58:50 ID:??? (+86,+30,+0)
    907 : Name_Not - 2010/09/27(月) 21:23:49 ID:??? (+69,+29,-25)
    >>906
    おお!有難うございました!
    しかもこんなにシンプルにできるんですね・・
    本当に助かりました。感謝の気持ちでいっぱいです。
    909 : Name_Not - 2010/10/01(金) 11:13:24 ID:??? (+3,-30,-274)
    jQueryでどう書けばいいか解りません。

    ------------html--------------
    <ul class="hoge">
    <li>a</li>
    <li>b</li>
    <li>c</li>
    <li>d</li>
    <ul>
    ------------css--------------
    ul,li { list-style-type:none; margin:0; padding:0; }
    .hoge { width:700px; }
    .hoge li { width:100px; float:left; }
    ------------------------------
    例えば上記のようなソースのhtml&CSSがあったとします。
    (親要素(.hoge)の幅)-(直下子要素の幅×数)=(残り余白)
    (残り余白)÷(直下子要素の数-1)=(直下子要素の右margin)
    (直下子要素の最終要素の右marginを0)
    のようにして、hogeの幅に対して(必ずしも指定してあるとは限らない)
    直下の子要素が等間隔で配置されるようにしたいのですが可能ですか?
    要素から幅を取ってくるとか、最後のliだけmarginを消すとかは出来ますが
    それを計算となるとどう書いていいのかサッパリで・・・
    可能であればどなたかコードを書いて頂ければと思います。
    910 : Name_Not - 2010/10/01(金) 13:42:05 ID:??? (+9,-30,-130)
    $('ul.hoge').each(function(){
    var ul = $(this);
    var li = ul.children();
    var rest = ul.width();
    li.each(function(){
    rest -= $(this).width();
    }
    var margin = rest / (li.length - 1);
    li.not(':last').css('margin-right', margin);
    });


    テストはしていない
    マージンが整数じゃないときに変な表示になるブラウザもあるかと思う
    911 : Name_Not - 2010/10/01(金) 14:45:29 ID:??? (+57,+29,-15)
    おお、レス早いw
    ありがとうございます。
    早速テストしてみます。
    912 : Name_Not - 2010/10/01(金) 16:31:47 ID:??? (+4,-30,-243)
    >>910
    動きました!ありがとうございます。
    最終的に以下のようにしてみました。
    -------------------
    $('ul.hoge').each(function(){
    var ul = $(this);
    var li = ul.children();
    var rest = ul.width();
    li.each(function(){
    rest -= $(this).width();
    })
    var margin = rest / (li.length - 1);
    var margin2 = margin / ul.width() * 10000;
    var margin3 = Math.floor(margin2) / 100;
    li.not(':last').css('margin-right', margin3 + '%');
    });
    -------------------
    子要素1子の余白÷親要素幅×100=親要素に対する余白の割合(%)
    にして端数を下2ケタ切り捨てにすれば
    もっと余りを切り詰められるかなとも思いましたが
    知識皆無なせいで多分酷いソースに・・・
    913 : Name_Not - 2010/10/04(月) 03:39:49 ID:??? (+67,-30,-95)
    テーブルの各要素をドラッグ&ドロップで入れ替えさせたいです。
    <tablel id="sort_list">
    <tr><td>AAA</td><td>BBB</td></tr>
    <tr><td>CCC</td><td>DDD</td></tr>
    <tr><td>EEE</td><td>FFF</td></tr>
    </table>
    <script type="text/javascript">
    $(function() {
    $("#sort_list").sortable({items:"tr"});
    });
    </script>

    で列ごとの入れ替えはできるのですが、td単位での変更ができません。
    td単位で変更するためのお知恵を拝借できないでしょうか。
    914 : Name_Not - 2010/10/04(月) 03:48:25 ID:??? (+54,+22,-16)
    >>913
    ライブラリ・プラグインに何を使っているのかを書こう
    915 : Name_Not - 2010/10/04(月) 03:50:50 ID:??? (+6,-30,-131)
    失礼しました。

    <link href="jquery-ui-1.8.5.custom.css" />
    <script type="text/javascript" src="jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="jquery-ui-1.8.5.custom.min.js"></script>

    になります。
    916 : Name_Not - 2010/10/04(月) 20:29:52 ID:??? (+25,-10,-17)
    >>915
    この場合、jquery-uiの何を使っているかまで書くべきだと思われ
    917 : 913 - 2010/10/05(火) 12:44:50 ID:??? (+6,-29,-51)
    >>916
    すみません。jqueryは初心者なもので、とりあえず
    jquery-ui-1.8.5.custom.min.js
    をすべて読み込んでおけば、ui関係のどれかが使われているものと考えて
    そこに含まれているものの何を使っているかまでは、わかりません。

    情報が少なくて申し訳ありません。
    918 : 913 - 2010/10/05(火) 12:48:47 ID:??? (+3,-30,-220)
    ちなみにWEBを調べていたところ、下記のようなサンプルを見つけたのですが
    これだとイメージの入れかえで、イメージに付随する文字列(画像名)も一緒に
    入れ替えができませんでした。
    ソースを見てみましたが、肝心のinterface.jsが読み込めず。。

    <script type="text/javascript" src="./jquery.js"></script>
    <script type="text/javascript" src="./interface.js"></script>

    <style type="text/css">
    div
    {
      width: 450px;
      height: 500px;
    }

    div img
    {
      float: left;
    width: 75px;
    height: 100px;
    margin:10px;
    }
    919 : 913 - 2010/10/05(火) 12:55:08 ID:??? (+3,-30,-195)
    続きです。

    sorthelper
    {
      background-color: #fff;
      float: left;
    }
    .sortableactive{}
    .sortablehover{}
    </style>
    <div>
      <img src="images/01.jpg" class="sortableitem" id="01"/>
      <img src="images/02.jpg" class="sortableitem" id="02"/>
      <img src="images/03.jpg" class="sortableitem" id="03"/>
    </div>
    <script type="text/javascript">
    $(document).ready(
      function () {
        $('div').Sortable({
    accept : 'sortableitem',
    helperclass : 'sorthelper',
    activeclass : 'sortableactive',
    hoverclass : 'sortablehover',
    opacity: 0.8,
    revert: true,
    floats: true,
    tolerance: 'pointer'
    })
    });
    </script>
    920 : Name_Not - 2010/10/05(火) 13:10:01 ID:??? (+46,+28,+1)
    そうですね。
    921 : Name_Not - 2010/10/06(水) 15:10:23 ID:??? (+23,-30,-137)
    jQueryで

    <a href="#" class="ChangeImage"><img src="test.jpg"></a>

    というリンクされた画像にマウスをのせると、
    画像を「test.jpg」から「test_2.jpg」に変更し、
    マウスを外すと「test.jpg」に戻す
    というのを作りたいのです。(拡張子は固定ではない)

    .hoverでアクションを設定して、srcの値を取ってきて「.」で区切って「_2.」を差し込んで…
    とおぼろげにはイメージできるんですが、全体を組み上げるには知識が足りず…。
    どなたかお願いします。
    922 : Name_Not - 2010/10/06(水) 15:43:13 ID:??? (+39,-30,+0)
    ちょっとイメージと違うかもしれないけど以前作ったもの。
    ページ内のすべての.rolloverに適用する。最初に元ファイル名を保持しておいて、適宜置換してる。
    ご参考まで。

    $(function(){
    $(".rollover a img").each(function(i,j){
    // はじめに元のimgファイル名をnameに登録してあとで参照可能に
    $(j).attr("name",$(j).attr("src"));
    });
    $(".rollover a")
    .mouseover(function(){
    $img = $(this).children("img");
    hovimg = $img.attr("name").replace(/down/,"").replace(/(\.(gif|jpg|png))$/,"hov$1");
    $img.attr("src",hovimg);
    }).mouseout(function(){
    $img = $(this).children("img");
    $img.attr("src",$img.attr("name"));
    }).mousedown(function(){
    $img = $(this).children("img");
    downimg = $img.attr("name").replace(/down/,"").replace(/(\.(gif|jpg|png))$/,"down$1");
    $img.attr("src",downimg);
    }).mouseup(function(){
    $img = $(this).children("img");
    hovimg = $img.attr("name").replace(/down/,"").replace(/(\.(gif|jpg|png))$/,"hov$1");
    $img.attr("src",hovimg);
    });
    });
    923 : Name_Not - 2010/10/06(水) 17:44:00 ID:??? (+77,-30,-39)
    手抜き

    $('.rollover img').mouseover(function () {
    this.src = this.src.replace('.', '_2.');
    }).mouseout(function () {
    this.src = this.src.replace('_2.', '.');
    });
    924 : Name_Not - 2010/10/06(水) 18:17:43 ID:??? (+7,-29,-27)
    >>913
    できるのは列じゃなくて行の入れ替えじゃね
    td単位ってのは行・列関係なくってこと?DDDとAAAを交換とか
    925 : Name_Not - 2010/10/06(水) 19:34:27 ID:??? (+71,+29,-21)
    >>922
    ありがとうございます。
    ですが何やら高等な事をやってるという事しかわからんですw
    読み解くのはかなり時間かかりそうですが、あれこれ弄らせて貰います。

    >>923
    ありがとうございます。
    早速試してみます。
    926 : Name_Not - 2010/10/07(木) 18:58:04 ID:??? (+33,-30,-119)
    >>923
    試してみたところ、ローカルでは上手く動作するのですが
    サーバ上に上げるとsrcがブラウザ内ではフルパスになっており
    (相対パスで記述してます)
    「http://www.~」の「.」を置き換えてしまいました。
    現状は
    $('.rollover img').mouseover(function () {
    this.src = this.src.replace('.jpg', '_2.jpg');
    }).mouseout(function () {
    this.src = this.src.replace('_2.jpg', '.jpg');
    });
    にして使っています。
    自分なりに改良していってみようと思いますが
    何かいい案ありますでしょうか?
    927 : Name_Not - 2010/10/07(木) 19:10:13 ID:??? (+39,-30,-82)
    922のように replace部分を正規表現にして
    .replace(/(\.(gif|jpg|png))$/,"_2$1");
    またはもっと大まかに
    .replace(/(\.(\w+)$)/,"_2$1");
    とか。
    正規表現知らなかったら調べてみるといいよ。超便利だから。
    mouseoutの部分は 923 のままでも大抵大丈夫そうだが。
    928 : Name_Not - 2010/10/07(木) 20:14:04 ID:??? (+84,+29,-70)
    >>927
    ありがとうございます。
    正規表現ナニソレウマイノ?ってぐらい何も知らなかったです。
    調べてみます。
    なにぶんjsの知識皆無でいきなりjQuery始めたもので
    近いサンプルを探してパクリプトが精一杯なので
    こういった具合に具体例出して貰えると助かります。
    929 : Name_Not - 2010/10/08(金) 17:07:47 ID:??? (+40,-30,-71)
    >>928

    data便利

    $.fn.rollover = function(){
    return this.each(function(){
    var target = $(this);
    target.data('src', target.attr('src'));

    target.hover(function(){
    target.attr('src', target.data('src').replace(/\.([^.]+)$/, "_2.$1"));
    },function(){
    target.attr('src', target.data('src'));
    });
    });
    };

    $('img.rollover').rollover();
    930 : Name_Not - 2010/10/12(火) 18:46:19 ID:auIW8qjH (+48,+26,-7)
    表の中に一定時間後、ランダムで画像を表示する。お願いします。
    931 : Name_Not - 2010/10/12(火) 22:19:44 ID:??? (+36,+7,+1)
    >>930
    しました。
    932 : Name_Not - 2010/10/13(水) 16:57:43 ID:??? (-23,-30,-103)
    >>930
    var src = ['hoge.jpg', 'huga.jpg', 'piyo.jpg'];
    var target = document.getElementById('random-image');
    setInterval(function(){
    target.src = src[Math.floor(Math.random() * src.length)];
    }, 10000);

    == html ==
    ~
    <table><tr><td><img id="random-image" src="hoge.jpg"></td></tr></table>

    テストしてないけどこんな感じじゃね
    934 : Name_Not - 2010/10/13(水) 22:09:15 ID:??? (-1,-29,-38)
    clearTimeoutを調べてみるといいよ
    935 : Name_Not - 2010/10/14(木) 21:48:01 ID:??? (+9,-30,-193)
    <ul>
    <li><label><input type="radio" checked="checked" /><span>hoge1</span></label></li>
    <li><label><input type="radio" /><span>hoge2</span></label></li>
    <li><label><input type="radio" /><span>hoge3</span></label></li>
    </ul>

    上記のhtmlで、ラジオボタンが現在選択状態のリストの<span>にclass="On"が付く
    という動作をさせたいのですが、jQueryでどう書けばいいか解りません。
    わかる方、お願いします。
    936 : Name_Not - 2010/10/14(木) 23:51:56 ID:??? (+38,-30,-119)
    >>935
    var radio = $('input[type=radio]');
    radio.click(function(e){
    var target = $(e.target);
    radio.not(target).next().removeClass('On');
    target.next().addClass('On');
    });
    937 : Name_Not - 2010/10/15(金) 00:46:14 ID:??? (+63,+29,-2)
    >>936
    おおお、早速ありがとうございます!
    うまく動きました!
    938 : Name_Not - 2010/10/21(木) 15:09:00 ID:??? (+3,-30,+0)
    http://www.akatsukinishisu.net/itazuragaki/data/js/i20070801/sample.html
    の高さを揃えるjquery-uiを使っているのですが
    上記ページの一番下にある「3個ずつ高さを揃える」というのを
    もっと簡略化できないかと思い、以下のようにしてみました。

    $(function HeightSet(group,setpice){
    var sets = [], temp = [], setpice2 = setpice-1;
    group.each(function(i) {
    temp.push(this);
    if (i % setpice == setpice2) {
    sets.push(temp);
    temp = [];
    }
    });
    if (temp.length) sets.push(temp);
    /* 各組ごとに高さ揃え */
    $.each(sets, function() {
    $(this).flatHeights().css("background","#fcc");
    });
    $(document).ready(function() {
    // 対象の要素とセットの最大数を記述
    HeightSet($("ul.hoge li"),4);
    HeightSet($("ul.huge li"),5);
    });
    })
    939 : (続き) - 2010/10/21(木) 15:11:22 ID:??? (+8,-29,-95)
    しかしこうすると最初の.hogeはうまく動いたのですが.hugeが動きません…。
    どうにかして最後のHeightSetを複数設定できるようにならないでしょうか?
    知恵をお貸し下さい。


    >>929
    気づくの遅くなってスイマセン、ありがとうございます。
    まだ実態参照とかも挫折気味ですが、こちらのスクリプトも参考にさせて頂きます。
    940 : Name_Not - 2010/10/21(木) 17:36:16 ID:??? (+43,-30,-247)
    (function($){
    function setHeight(target, step){
    for(var i = 0; i < target.length; i += step){
    var group = [];
    for(var j = 0; j < step; j++){
    if(target[i + j]){
    group.push(target[i + j]);
    }
    }
    $(group).flatHeights();
    }
    return target;
    }

    $(function(){
    setHeight($('ul.hoge li'), 4).css('background-color', '#ffcccc');
    setHeight($('ul.huga li'), 5).css('background-color', '#ccccff');
    });
    })(jQuery);


    要求満たしてるかしらんけどこんなんでいかが?
    941 : Name_Not - 2010/10/21(木) 23:47:48 ID:??? (+62,+29,+0)
    >>940
    思った通りに動きました!
    ありがとうございます。
    943 : Name_Not - 2010/10/31(日) 01:04:10 ID:??? (+12,+27,-1)
    945 : Name_Not - 2010/10/31(日) 21:48:50 ID:??? (+43,+27,-1)
    >>944
    おかしくないよ?
    946 : Name_Not - 2010/10/31(日) 23:50:42 ID:JN5oBgF4 (+4,+29,-1)
    いや、それはおかしいと思います。
    947 : Name_Not - 2010/11/01(月) 02:00:48 ID:??? (+50,+27,-1)
    >>946
    おかしくないよ?
    948 : Name_Not - 2010/11/01(月) 06:53:55 ID:??? (+52,+29,-16)
    コミュ貧の集まりだな
    949 : Name_Not - 2010/11/01(月) 08:49:58 ID:??? (+0,-30,-33)
    >>943
    再現した。 1 -1 1 ~ -4 4 -4・・・
    win7 7.0.517.41 beta
    4.0.249.30は問題なかった。
    やる気ないのでパス。
    950 : Name_Not - 2010/11/01(月) 18:52:50 ID:??? (+19,-4,-57)
    >>944
    同じく Google Chrome 7 で再現した。
    Chrome依存の現象なのが気になるので検証しようかと思ったが、想像以上に読みづらいコードだったのでパス…。
    http://sandbox.leigeber.com/table-sorter/script.js
    ←前へ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 次へ→ / 要望・削除依頼は掲示板へ / 管理情報はtwitterで / JavaScript スレッド一覧へ
    スレッド評価: スレッド評価について
    みんなの評価 :
    タグ : 追加: タグについて ※前スレ・次スレは、スレ番号だけ登録。駄スレにはタグつけず、スレ評価を。荒らしタグにはタグで対抗せず、タグ減点を。

    類似してるかもしれないスレッド


    トップメニューへ / →のくす牧場書庫について