web-dev-qa-db-ja.com

全文を表示するには、トリミングされたビューフィールドにカーソルを合わせますか？

ビューテーブルにテキストフィールドがあり、[結果の書き換え]-> [省略記号]オプションをオンにしてこのフィールドを最大長にトリミングします。このトリミングされたテキストにカーソルを合わせると、フルバージョンがポップアップとして表示されるか、ビューが更新されてフルテキストが表示されるようにすることは可能ですか？

viewsentitiestheming
8
7wonders

自分の賞金問題に答えるのは嫌いですが、これは私が望んでいるとおりに機能します。

Beautytipsモジュールでこれを行うための素晴らしい方法を見つけました。私のフィールドはアドレス（field_address）です。ビューにfield_addressを追加し、Ellipsisを使用して書き換え->トリムしますが、表示から除外します。今度は同じフィールドをもう一度追加して、フィールドの出力を次のように書き換えます。

<div class="beautytips" title="[field_address_1]">[field_address]</div>

（美容ヒントの設定で[すべてのページに美容ヒントjsを追加]を有効にしています）

+1 zhilevanの回答も非常に良い解決策ですが、残念ながらロールバック/ロールアップ/クローズオプションがありません。

10
7wonders

Rewrite resultsでは、結果を<div>や<span>などのhtml要素に入れ、idまたはclassで指定することをお勧めします。そしてそれを使用した後は Jquery Readmore Plugin を使用します。

これは samples jquery readmoreプラグインの使用に役立つかもしれません

7
Yusef
(function($) {
    Drupal.behaviors.expalain_popup = {
      attach:function() {
        jQuery('a.open_popup_link').click(function(){
          var node_id = jQuery(this).attr('data-value');
          window.open('/open_popup/node/'+node_id, 'Explain '+node_id,'width=450,height=600,resizable=1,scrollbars=1,toolbar=0,location=0');
        });
    }
  };
}(jQuery));

このコードは、目標を達成するのに役立ちます。

1
Rishi

JSでそれを行うと思います。それははるかに簡単であり、まだ仕事をします。

手順：

  1. ビューにフィールド全体を出力する
  2. ページの読み込み時にそれをトリミングします。元の完全な説明を別のコンテナに複製し、特別なクラスまたはIDを付けます
  3. 最後に省略記号を追加し、ホバー/クリック時に関数をアタッチします
  4. ユーザーがクリック/ホバーすると、クローンされた説明がポップアップに表示されます（テキストが多く、レイアウトが壊れる場合）。

必要に応じて、これの代わりに、余分な文字をスパンにラップして非表示にすることができます。省略記号をクリックすると、別のクラスをスパンに適用して表示できます。

1
Aram Boyajyan