一覧画面の画像サムネイルの解像度を上げたい。

kintone カスタマイズ
1

一覧画面でのサムネイルのサイズをデフォルトで

縦横50px*50pxぐらいなのを

100px*100pxくらい出したいです。

 

過去の投稿の「【再】レコード一覧に表示させる画像サイズについて」を

参考に、cssとjavascriptを作ってみましたが、javascriptの方が全く機能しません。

良い方法をご教示いただけないでしょうか？

--------私が書いたjavascript---------

kintone.events.on(‘app.record.index.show’, function(e) {
(window.onload = function() {

var thumbnail = $(‘img.gaia-ui-slideshow-thumbnail’);
var newThumbnailSrc = thumbnail.attr(‘src’).replace(‘&w=50&h=50’,‘&w=100&h=100’);
thumbnail.attr(‘src’, newThumbnailSrc);

});
});

2

見たところ、$関数やattr関数などjQueryの記法を使っているので一緒にjQueryを読み込む必要があると思います。

jQueryの読み込み方法については以下の投稿が見やすくて参考になると思います。https://developer.cybozu.io/hc/ja/community/posts/900002526163/comments/900002074203
※ここで教えてくれているCybozu CDN、および提供している外部ライブラリは利用者の責任での利用になります

jQueryは、DOM操作をするとき、素のJSを書くよりもシンプルに書けるようになります。
チュートリアル https://developer.cybozu.io/hc/ja/articles/204695384 でも少し触れてますので良かったら見てみてください。

3

ご回答のほど、誠にありがとうございます。

いただいた内容を試してみたのですが、

状況変わらず、サムネイルの画像は荒いままになっております。

 

サムネイルの画像に該当する<img>タグ内の

「src=“・・・・w=50&h=50&・・・”」を

「src=“・・・・w=100&h=100&・・・”」などに変換できれば目的達成なのですが、

具体的な方法ございましたら、ご教示いただけますと幸いです。

4

ヤマグチさん

お世話になっております。横から失礼いたします。

下記などを参考に、コンソール画面になにかエラーが表示されていないか確認するとよいかと思います。
https://developer.cybozu.io/hc/ja/articles/207613916

また、下記コメントでも注意書きしておりますがHTML要素のclass属性に依存しているため、非推奨な実装方法となっています。
https://developer.cybozu.io/hc/ja/community/posts/115009465206/comments/115004255043

可能であれば、ファイルダウンロードAPIなどを用いながら、カスタマイズビューを作成することをおすすめいたします。
https://developer.cybozu.io/hc/ja/articles/202905604
https://developer.cybozu.io/hc/ja/articles/202166180

5

江田様 コメントありがとうございます。

コンソール画面には何も表示されていないため、エラーではなさそうです。

やはり非推奨な実装なためできないのかもしれないです。

カスタマイズビューを見てみることにいたします。