0

phpとjquerymobileを使用して動的グリッドを構築しようとしています。誰かがモジュラスを使用して、反復のキー値に応じてui-block-を広告する必要があるかどうかを判断するのを手伝ってくれるかどうか知りたいです。

  <div class="ui-grid-c">
        @forelse($photos as $key=>$photo)

            @if($key == 1)
                <div class="ui-block-a">                                
                    <img src="{{ $photo['file'] }}" width="60" />
                </div>
            @elseif($key == 2)
                <div class="ui-block-b">                                
                    <img src="{{ $photo['file'] }}" width="60" />
                </div>
            @elseif($key == 3)
                <div class="ui-block-c">                                
                    <img src="{{ $photo['file'] }}" width="60" />
                </div>
            @elseif($key == 4)
                <div class="ui-block-d">                                
                    <img src="{{ $photo['file'] }}" width="60" />
                </div>  
            @endif

        @empty

            Nothing Found

        @endforelse
    </div>

いくつかの異なるモジュラスバリエーションを試しましたが、何も正しく機能しませんでした。どんな助けでもいただければ幸いです。

4

1 に答える 1

0

列の数に基づいて動的になるように ui-grid-c クラスを変更する必要があります。

  • ui-grid-a = 2 列
  • ui-grid-b = 3 列
  • ui-grid-c = 4 列
  • など。

あなたの列のために..

  • ui-block-a - 最初の列です
  • ui-block-b - 2 番目の列です
  • など。

したがって、列に追加した回数を追跡してから、アルファベット文字を追加する必要があります。

を使用すると、文字 a が得られ、列を追加するときに他の文字の 86 がインクリメントされます。

于 2013-05-09T20:50:45.247 に答える