目前,我正在使用表格以相同大小的块显示 4 个摄像机:左上/右上/左下/右下。我想切换到 div,有可能事情会更自动化一些。
这是我所拥有的:
<table border="">
<tr>
<td>
<object id="Player1" height="600" width="800" border="" classid="CLSID:745395C8-D0E1-4227-8586-624CA9A10A8D">
<param name="AutoStart" value="1">
<param name="UIMode" value="none">
<param name="MediaType" value="mjpeg">
<param name="NetworkTimeout" value="5000"><!-- use this param if you want to change the network timeout -->
<param name="MediaUsername" value="root"><!-- this param only necessary if restricted access is enabled -->
<param name="MediaPassword" value="admin"><!-- this param only necessary if restricted access is enabled -->
<param name="MediaURL" value="http://10.77.130.65/axis-cgi/mjpg/video.cgi?resolution=800x600&fps=10"><!-- your media url goes here -->
</object>
</td>
<td>
<object id="Player2" height="600" width="800" border="" classid="CLSID:745395C8-D0E1-4227-8586-624CA9A10A8D">
<param name="AutoStart" value="1">
<param name="UIMode" value="none">
<param name="MediaType" value="mjpeg">
<param name="NetworkTimeout" value="5000"><!-- use this param if you want to change the network timeout -->
<param name="MediaUsername" value="root"><!-- this param only necessary if restricted access is enabled -->
<param name="MediaPassword" value="admin"><!-- this param only necessary if restricted access is enabled -->
<param name="MediaURL" value="http://10.77.130.67/axis-cgi/mjpg/video.cgi?resolution=800x600&fps=10"><!-- your media url goes here -->
</object>
</td>
</tr>
<tr>
<td>
<object id="Player3" height="600" width="800" border="" classid="CLSID:745395C8-D0E1-4227-8586-624CA9A10A8D">
<param name="AutoStart" value="1">
<param name="UIMode" value="none">
<param name="MediaType" value="mjpeg">
<param name="NetworkTimeout" value="5000"><!-- use this param if you want to change the network timeout -->
<param name="MediaUsername" value="root"><!-- this param only necessary if restricted access is enabled -->
<param name="MediaPassword" value="admin"><!-- this param only necessary if restricted access is enabled -->
<param name="MediaURL" value="http://10.77.130.70/axis-cgi/mjpg/video.cgi?resolution=800x600&fps=10"><!-- your media url goes here -->
</object>
</td>
<td>
<object id="Player3" height="600" width="800" border="" classid="CLSID:745395C8-D0E1-4227-8586-624CA9A10A8D">
<param name="AutoStart" value="1">
<param name="UIMode" value="none">
<param name="MediaType" value="mjpeg">
<param name="NetworkTimeout" value="5000"><!-- use this param if you want to change the network timeout -->
<param name="MediaUsername" value="root"><!-- this param only necessary if restricted access is enabled -->
<param name="MediaPassword" value="admin"><!-- this param only necessary if restricted access is enabled -->
<param name="MediaURL" value="http://10.77.130.12/axis-cgi/mjpg/video.cgi?resolution=800x600&fps=10"><!-- your media url goes here -->
</object>
</td>
</tr>
</table>
我想改用div。我查看了堆叠的 div,似乎我可以有一个指定总宽度的容器。在这种情况下,它可能是 1080 或 720 个电视屏幕。是否可以在可用空间量中最大化 4 个 div 并自动执行或通过指定宽度来执行此操作。
我有一个问题:它是否能够根据屏幕尺寸或容器宽度自动计算对象线的高度和宽度?它也被硬编码在 url 中。
编辑:(http://10.77.130.12/axis-cgi/mjpg/video.cgi?resolution=800x600&fps=10
宽度/高度在那里硬编码),也在对象线上。保持硬编码我确信我可以将东西切换到 div。但是让它们根据窗口大小自动调整大小并与视频对象交互是我不确定的。如果那是可能的。