レスポンスプロファイル画像の隣のFABボタンの相対的な位置付け

プロフィール画像の横にFAB（カメラ）を配置したい（反応する）。プロファイルの画像の位置は画面のサイズに基づいて変化するので、私はプロファイルの画像に対するボタンの位置を計算したいと思います。レスポンスプロファイル画像の隣のFABボタンの相対的な位置付け

これを試しましたが、ボタンは写真の最後まで配置されています。

<ion-content padding> 
    <div style="position:relative"> 
     <ion-item> 
      <ion-avatar><img src="../../assets/AJ_pic.jpg" alt=""></ion-avatar> 
      <button ion-fab mini color="primary" style="position:relative; bottom:0; right:0; transform: translate(0%, 0%);"><ion-icon name="camera"></ion-icon></button> 
     </ion-item> 
</div>

それはWhats'Appインターフェイスのようにする必要があります。

FAB は、ページがスクロール可能なので、位置に固定しないでください。助言がありますか？

出典

2017-05-10 Neo Split

あなたが、少なくとも自分のためにこれをコーディングすることを試みることが期待されます。スタックオーバーフローはコードを書くサービスではありません。私はいくつか[**追加の研究**]を行うことをお勧めします（http://meta.stackoverflow.com/questions/261592/how-much-research-effort-is-expected-of-stack-overflow-users） Googleを介して、またはSOを検索して、試みてください。それでも問題が解決しない場合は、**あなたのコード**に戻り、あなたが試したことを説明してください。 –

あなたが正しいです、私が試したコードを追加する必要があります。ただそれをしました。 –

使用

position: absolute

簡単なデモ：

https://jsfiddle.net/5t49m2r8/

出典

2017-05-10 16:33:31

Andrewに感謝します。私が解決しようとしている問題は、画像が画面サイズに基づいて "反応する"ので、その位置が変わるということです。私が本当にやりたいことは、ボタンを画像自体に相対的に配置することです。それがどのように可能か知っていますか？ –

レスポンスプロファイル画像の隣のFABボタンの相対的な位置付け

答えて

関連する問題