Skip to main content
Known Participant
November 23, 2019
Question

Dreamweaver 2019 & 2020 freezes in live mode with embedded autoplay video

  • November 23, 2019
  • 1 reply
  • 1307 views

[Topic edited  by moderator for clarity.]

 

Anyone else have this issue or know a fix? I have a website that opens fine in 2018, but freezes (and stays frozen) when I open the index.htm file in Split View, with there being a YouTube video as the background. Removing the code it opens fine. Code below. 

 

<!-- YouTube background video -->
<div id="bg-video" data-property="{videoURL:'http://youtu.be/ab0TSkLe-E0', containment:'body', autoPlay:true, mute:true, startAt:0, showControls:false}" data-poster="images/poster.jpg"></div>
<div id="bg-video-controls">
<a id="bg-video-volume" class="icon icon-mute" href="#" title="Unmute"><span class="screen-reader-text">Unmute</span></a>
<a id="bg-video-play" class="icon icon-pause" href="#" title="Pause"><span class="screen-reader-text">Pause</span></a>
</div>
This topic has been closed for replies.

1 reply

Nancy OShea
Community Expert
Community Expert
November 23, 2019

I can't reproduce it with the code you posted.  So something is missing.  I will say that auytoplay is intrusive.  Set autoplay to False because that is firing up video every time your Live view screen refreshes.   Can you switch to Design view instead?

 

Nancy O'Shea— Product User & Community Expert
Known Participant
November 23, 2019

I just tried both your suggestions. One, switched autoplay to "false". Two, switched to "design" view. Both work, allowing me to work on the video. However, it's a workaround and not a fix.

 

I can switch back autoplay to "true" when I upload it, but there has to be a better fix. And I never work in "Design View". 

 

Here's the full code if it helps : )

 

<!DOCTYPE html>
<html lang="en-US" class="no-js">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<title>Adobe Test</title>
    
<!-- Included CSS Files -->
<link href="//fonts.googleapis.com/css?family=Open+Sans:400,400italic,700,700italic%7CRoboto+Slab:400,700" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" media="all" href="css/style.css" />
<script type="text/javascript" src="js/modernizr-custom.js"></script>
 
</head>
 
<body>
<div class="wrap">
 
<!-- Main -->
<div id="main">
<div class="inner">
 
<!-- Header -->
<header class="site-header">
<h1 class="site-title fade-in"><img src="images/logo.png" width="400" height="43" alt="" /></h1>
</header>
 
<!-- Content -->
<section class="content">
 
<div id="timer"></div>
 
<p class="subtitle">Test</p>
 
<!-- Newsletter form -->
<div id="newsletter" class="form-wrap">
<form action="subscribe.php" method="post" id="newsletter-form">
<p class="form-field">
<label for="newsletter_email" class="screen-reader-text">Please enter your email</label>
<input type="text" name="newsletter_email" id="newsletter_email" value="" placeholder="Your email" />
</p>
<p class="form-submit">
<input type="submit" name="newsletter_submit" id="newsletter_submit" value="Subscribe" />
</p>
</form>
</div>
</section>
 
<!-- Modal page toggle -->
<div class="modal-toggle">
                <i class="icon icon-newspaper"></i>
<a href="#" id="modal-open"><span class="modal-note">Read More</span></a>
</div>
</div>
</div>
 
<!-- Modal page: About Us -->
<div id="modal">
<div class="inner">
 
<!-- Modal toggle -->
<div class="modal-toggle">
                <i class="icon icon-cross"></i>
    <a href="#" id="modal-close"><span class="modal-note">Close</span></a>
</div>
 
<!-- Content -->
<section class="content">
 
<h1 class="section-title">About</h1>
 
<!-- Columns -->
<div class="row">
<div class="one-half">
<p><i>ETest.</p>
<p>Test</p>
</div>
<div class="one-half">
<h2><i class="icon icon-mail"></i>Email</h2>
<p>support@test.com</p>
<h2><i class="icon icon-map"></i>Location</h2>
<p>Adobe, USA</p>
</div>
</div>
 
</section>
</div>
</div>
</div>
 
<!-- Background overlay -->
<div class="body-bg"></div>
 
<!-- YouTube background video -->
<div id="bg-video" data-property="{videoURL:'http://youtu.be/ab0TSkLe-E0', containment:'body', autoPlay:false, mute:true, startAt:0, showControls:false}" data-poster="images/poster.jpg"></div>
<div id="bg-video-controls">
<a id="bg-video-volume" class="icon icon-mute" href="#" title="Unmute"><span class="screen-reader-text">Unmute</span></a>
<a id="bg-video-play" class="icon icon-pause" href="#" title="Pause"><span class="screen-reader-text">Pause</span></a>
</div>
 
<!-- Loading... -->
<div id="preload">
<div id="preload-content">
<div class="preload-spinner">
<span class="bounce1"></span>
<span class="bounce2"></span>
<span class="bounce3"></span>
</div>
<div class="preload-text">Loading...</div>
</div>
</div>
 
<!-- Included JS Files -->
<script type="text/javascript" src="js/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="js/plugins.js"></script>
<script type="text/javascript" src="js/jquery.mb.YTPlayer.min.js"></script>
<script type="text/javascript" src="js/scripts.js"></script>
</body>
</html>
Nancy OShea
Community Expert
Community Expert
November 23, 2019

This is still only partial code because we don't have your external scripts and CSS files.

 

As far as DW crashing,  check your crash logs to see what's causing DW to crash.  Try Restore Preferences

https://helpx.adobe.com/dreamweaver/kb/restore-preferences-dreamweaver.html

 

If crashes continue,  submit a bug report from your Help Menu along with a small test page containing embedded scripts and CSS code that the engineers can use to reproduce the problem in their lab.  

 

I use embedded YouTube videos without issue.  But autoplay is against my religion.  It's not polite to push media on people who may not wish to consume it.  Long live the PLAY button 🙂  

 

 

 

Nancy O'Shea— Product User & Community Expert