hides model until preload image has loaded

This commit is contained in:
buttle 2021-06-20 17:02:13 +02:00
parent 4c3dfe5d49
commit 8e61892290
3 changed files with 18 additions and 11 deletions

View File

@ -2,7 +2,8 @@
.model-wrap {
padding: 1em;
background-color: lightgray;
display: none;
/*background-color: lightgray;*/
}
#object {

2
static/jquery-3.6.0.min.js vendored Normal file

File diff suppressed because one or more lines are too long

View File

@ -1,5 +1,7 @@
% rebase('base.tpl')
<script src="/static/jquery-3.6.0.min.js"></script>
<style>
model-viewer {
width: 500px;
@ -44,9 +46,6 @@ model-viewer {
</style>
%end
<h3>
<i class="fa fa-folder-o" aria-hidden="true"></i>
<a href="/list/{{ current_dir.rstrip('/') }}">objects/{{current_dir}}</a>
@ -59,7 +58,7 @@ model-viewer {
</h4>
<div class="model-wrap">
<div id="model" style="display:absolute">
<div id="model" style="display:absolute">
<model-viewer id="3d-model"
reveal="interaction"
src="{{ object['urls'][0] }}"
@ -76,8 +75,13 @@ model-viewer {
<div id="button-load" slot="poster">Load 3D Model</div>
%end
</model-viewer>
</div>
</div>
</div>
<script type="module" src="/static/vendor/google/model-viewer.js"></script>
<script>
jQuery(function($) {
$(".model-wrap").show();
});
</script>