WeChat アプレットは画像の適応幅を実装します

小云云
リリース: 2018-03-17 13:16:56
オリジナル
7000 人が閲覧しました

この記事では主に、画像の適応幅を実装するための WeChat アプレットについて説明します。まず、画像コンポーネントを理解してください。

1. 画像コンポーネントを理解する

画像の幅と高さはデフォルトで固定されているため、画像を調整するのは困難です。 一緒に解決しましょう


2. メソッド

(1)。幅は変更されず、高さは自動的に変更され、元の画像のアスペクト比が変更されます。は変わりません。 まず、画像モードを widthFix に設定し、次に 730rpx などの固定 rpx 幅を画像に追加します。

このようにして、写真を調整することもできます。 。ミニプログラムのrpx自体が適応型表示単位なので



(2)。

動的に適応させるにはbindloadバインディング関数を使います。 この関数を使用すると、上記のbindloadの説明と同様に、元の画像の幅と高さを取得できます。
次にアスペクト比を計算します。 。次に、幅のサイズ (rpx) を設定し、最後にスタイルを通じて画像の幅と高さを動的に設定します。コード: 関連おすすめ:

10 個の画像ギャラリーの例の概要

以上がWeChat アプレットは画像の適応幅を実装しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート