ラズパイ（IOT・７７）

カメラの画像は、コントローラーの背面において
操作の邪魔にならないようにするのと、画像をより
広く見えるようにしたいと思います。
動画の撮影には今回 pistreamingを利用してますので、
iframeに表示させてます。
このiframeの上に、divを重ねてコントローラーを設置してます。
上下に重ねる場合、なかなか苦労しますが、以下のような
感じで配置完了です。

<style>
.console_panel {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 z-index: 1;
}
</style>

  <div class="console_panel">
    ...
  </div>
  
  <iframe class="img_view" src="http://192.168.1.26:8082/index.html" width="100%" scrolling="no" frameborder="no" style="position: absolute; z-index:0;" />