すたらブログ

文系Webプログラマの備忘録

jQuery: bxsliderでPCとモバイルで表示する画像を切り替えたい

jQuery

A型事業所でのWebサイト制作で、bxsliderというjQueryプラグインを利用しています。
その際、「PCビューとモバイルビューとで、スライド画像の中身を変えてほしい」と指示されました。
PCビューでは16:9の比率、モバイルビューでは4:3の比率の画像を使いたいそうです。

はじめは<img>のsrc属性を変更することで対処していましたが、ふと「2種類のリストを用意して、使わない方は非表示にすればもっとシンプルになる」と思いつきました。
…まあ、普通はそちらを先に思いつきますよね…。

念のため、他に方法がないか、専用のオプションが公式で用意されていないかを確認するためにGitHubのIssue欄で質問しましたが、「その方法でいいよ」とお墨付きをもらいました。
現在制作中のWebサイトだけでなく今後もこのプラグインを利用する可能性があるので、きちんと確認できて良かったです。