ホームページ >ウェブフロントエンド >jsチュートリアル >レイヤーフロントエンドコンポーネントは画像表示機能メソッドを実装します。

レイヤーフロントエンドコンポーネントは画像表示機能メソッドを実装します。

小云云
小云云オリジナル
2018-01-29 10:39:271817ブラウズ

この記事では、layuiでレイヤーフロントエンドコンポーネントの画像表示機能を実現する方法を主に紹介し、layuiで画像表示機能を呼び出すための操作方法と関連する注意事項を分析します。必要な方のために、layer およびlayui のソース コードのダウンロードも提供しています。ぜひ参考にしてください。皆さんのお役に立てれば幸いです。

画像表示機能を実現するには:layer

1. ここでレイヤーフロントエンドコンポーネントを紹介します

layer は優れた評判を持つ Web Elastic Layer コンポーネントであり、あらゆるレベルに対応することに尽力しています。開発者を使用すると、ページは簡単にリッチでユーザーフレンドリーなエクスペリエンスを得ることができます。

公式 Web サイトのダウンロード アドレス: http://layer.layui.com/

または、ここをクリックしてこの Web サイトからダウンロードします。

具体的な使用方法があります

ここで注意すべき点がいくつかあります: レイヤー フロントエンド コンポーネントを使用する前に、レイヤーの js ファイルを導入する必要があります

<script type="text/javascript" src=".../.../layer/layer/layer.js"></script>
<script type="text/javascript" src=".../...//layer/layer/extend/layer.ext.js"></script>
注:layer.js ファイルは jquery の後に導入する必要があります。 layer.js は jquery.js をベースにしています。

2.json

画像表示機能を実現するには、jsonも必要です:

具体的な使用方法は次のとおりです:

{ //您服务端接口需严格按照下述格式返回
    "status": 1,  //请求的状态,1表示成功,其它表示失败
    "msg": "", //状态提示语
    "title": "",  //相册标题
    "id": number型,  //相册id
    "start": 0, //初始显示的图片序号,默认0
    "data": [  //相册包含的图片,数组格式
      {
        "name": "", //图片名
        "pid": number型, //图片id
        "src": "", //原图地址
        "thumb": "", //缩略图地址
        "area": [638, 851] //原图宽高
      }
    ]
}
のようなappendメソッドを使用してください:

StringBuilder str = new StringBuilder();
そして上記のリンクをたどる必要があります。正確です

最終的な戻り値は次のとおりです:

return str.toString();
具体的な使用方法は公式Webサイトhttp://layer.layui.com/

でも見ることができます関連推奨事項:

jQueryアップロードの簡単な実装の詳細な例画像表示プレビュー機能

画像コントロールのJS実装 サイズの表示方法【画像比例拡大縮小機能】

画像表示付きPHP画像アップロードクラス_PHPチュートリアル

以上がレイヤーフロントエンドコンポーネントは画像表示機能メソッドを実装します。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。