添付ファイルフィールドに配置された画像データを、横方向に配置したいです。
以前、こちらで掲載されていた記事を参考にcssでカスタマイズしました。(下記のコード)
しばらくは問題なく実行できていたのですが、
いつの間にか反映されなくなってしまいました。
.file-image-container-gaia {
float: left;
}
これ以外のカスタマイズを停止させた状態でも試してみましたが、変化はないようです。
なにかアップデートがあったのでしょうか。
「いいね！」 1
フロントエンド刷新プロジェクトがずっと走っているようなので、
DOMをいじるようなカスタマイズはいつ使えなくなるかは分からないです。
いつの間にか反映されなくなるというのを見越してカスタマイズしないといけません。
こちらにも記述があります
kintone で使われている id や class 属性
各要素に付与されている id や class 属性の値は、予告なく変更されます。
DOM 構造についても変更されることがあります。カスタマイズするときは、id や class 属性の値、および DOM 構造を変更するカスタマイズを加えないでください。
以下の動画はR3さんの動画ですが詳しく説明されています。わかりやすいのでおすすめです！
というわけで、
DOM操作をしてカスタマイズをしている限りは、
各要素に付与されている id や class 属性の値は、予告なく変更されます。
DOM 構造についても変更されることがあります。
とのイタチごっこになると思うので、DOM構造をもう一度調べてコードを書き直すか、影響を受けないカスタマイズにするか・・・・・になると思います
！
「いいね！」 1
sou さん
こんにちは、横槍申し訳ないです。
運営様も申し上げているように、DOM操作は突然変更される場合があるので自己責任でと書かれております…
ご提案として、一つこのようにしてみてはいかがかなと考え返信させていただきました。
早速ですが以下にソースコード書かせて頂きますね。
kintone.events.on('app.record.detail.show', async () => {
const element = kintone.app.record.getFieldElement('フィールドコード').children;
element[0].style.display = 'flex';
})
このようにするとこちらの環境では、添付ファイルの画像が横並びになりました。
一応軽くご説明させて頂くと、getFieldElement(‘フィールドコード’)でフィールドのDOM要素をフィールドコードで取得してきて、画像の親要素に対してdisplay = 'flex’を行うことによって画像が横並びになります。
下記画像でいうと画像２枚の親要素のを指定したいので、getFieldElement(‘フィールドコード’)で取得してきたDOM要素でいうと一つ下の階層を指定する.children0に対してflexを行うことで横並びになる寸法でございます。
余談ですが、こちらの方法ですとクラス名やidが変更になっても取得した要素に対して指定しているので、添付ファイルフィールドの階層構造が変わらない限りこちらのコードは動作し続けるはずです。
また、画像の大きさに関しては、添付ファイルのサムネイルの大きさの指定とフィールドそのものの横幅で決まるようです。
一応お読みしてみてご提案としてマッチしているかなと感じたので回答してみました！
宜しければお使いくださいね！
参考画像：
「いいね！」 3
このトピックは最後の返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。