made iframes draggable
This commit is contained in:
parent
86f35d2501
commit
db00617080
13
hello.py
13
hello.py
@ -3,6 +3,19 @@ from flask import render_template
|
||||
|
||||
app = Flask(__name__)
|
||||
|
||||
@app.context_processor
|
||||
def override_url_for():
|
||||
return dict(url_for=dated_url_for)
|
||||
|
||||
def dated_url_for(endpoint, **values):
|
||||
if endpoint == 'static':
|
||||
filename = values.get('filename', None)
|
||||
if filename:
|
||||
file_path = os.path.join(app.root_path,
|
||||
endpoint, filename)
|
||||
values['q'] = int(os.stat(file_path).st_mtime)
|
||||
return url_for(endpoint, **values)
|
||||
|
||||
@app.route('/')
|
||||
def hello_world():
|
||||
return 'Hello, World!'
|
||||
|
@ -1,13 +1,24 @@
|
||||
* {
|
||||
background-color: gray;
|
||||
}
|
||||
|
||||
#video1 {
|
||||
padding-top: 100px;
|
||||
margin-top: 300px;
|
||||
}
|
||||
|
||||
.draggable {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.draggable img {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.draggable iframe {
|
||||
padding: 20px;
|
||||
}
|
||||
#video2 {
|
||||
padding-top: 100px;
|
||||
position: relative;
|
||||
margin-top: 100px;
|
||||
}
|
||||
|
||||
#audio1 {
|
||||
|
@ -1,7 +1,10 @@
|
||||
<!doctype html>
|
||||
<html>
|
||||
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
|
||||
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
|
||||
<script src="../static/js/draggable.js"></script>
|
||||
<head>
|
||||
<link rel="stylesheet" href="../static/css/style.css">
|
||||
<link rel="stylesheet" href="../static/css/style.css?q=1280549780">
|
||||
<title>Perspective A</title>
|
||||
</head>
|
||||
<body>
|
||||
@ -10,11 +13,11 @@
|
||||
<audio controls src="../static/audio/turkish_march.ogg" type="audio/ogg"></audio>
|
||||
|
||||
</div>
|
||||
<div id="video1">
|
||||
<iframe width="420" height="281" src="https://www.youtube.com/embed/fKOKxuFyEdg" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
|
||||
<div class="draggable">
|
||||
<iframe id="video1" width="120" height="120" src="https://www.youtube.com/embed/fKOKxuFyEdg" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
|
||||
</div>
|
||||
<div id="video2">
|
||||
<iframe width="340" height="250" src="https://www.youtube.com/embed/5_9PAugYb4s" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
|
||||
<div class="draggable">
|
||||
<iframe id="video2" width="120" height="120" src="https://www.youtube.com/embed/5_9PAugYb4s" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
Loading…
Reference in New Issue
Block a user