A Simple Floating Panel Example - Adobe 38040334 - Dreamweaver CS3 User Manual
Extending dreamweaver
Hide thumbs
Also See for 38040334 - Dreamweaver CS3:
- User manual (497 pages) ,
- User manual (738 pages)
Table of Contents
Advertisement
A simple floating panel example
In this example, you create a Script Editor extension that creates a floating panel to display the JavaScript code that
underlies a selected script marker in Design view. The Script Editor displays the JavaScript code in the
element of an HTML form that is defined in a floating panel called
code in the floating panel, the extension calls the
selected a script marker when you invoke the Script Editor, the extension displays
floating panel called
blanklayer
You create this extension by performing the following steps:
• "Creating the floating panels" on page 220
• "Writing the JavaScript code" on page 221
• "Creating a menu item" on page 223
Creating the floating panels
The beginning of the HTML file for this extension contains the standard document header information and a
tag that puts the words Script Editor in the title bar of the floating panels.
To create the HTML file header:
Create a new blank document.
1
Enter the following:
2
<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Script Editor</title>
<script language="JavaScript">
The extension defines two floating panels that display either
script marker or the JavaScript code that underlies a selected script marker. The following code defines these two
absolutely positioned (AP) element s, called
floating panels, or
To create the two floating panels:
Add the following code after the header in the HTML file:
1
<body>
<div id="blanklayer" style="position:absolute; width:422px; ¬
height:181px; z-index:1; left: 8px; top: 11px; ¬
visibility: hidden">
<center>
<br>
<br>
<br>
<br>
<br>
(no script selected)
</center>
</div>
<div id="scriptlayer" style="position:absolute; width:422px; ¬
height:181px; z-index:1; left: 8px; top: 11px; ¬
updateScript()
.
. If you make changes to the selected
scriptlayer
function to save your changes. If you have not
(no script selected)
if the user has not selected a
(no script selected)
and
blanklayer
scriptlayer
DREAMWEAVER CS3
Extending Dreamweaver
textarea
in a
title
:
220
Advertisement
Table of Contents
