|
-
Mimic'ing hidden/visible layers
Hi,
Loved the book (sorry to gush).
I'm working on a site where we want most everything to be generated by JSP.
I'm at a loss for how to start (I'm still pretty new at JSP) setting up
a hidden layer to mimic a layer becoming visible when the mouse clicks a
button (the purpose would be a nice pop up submenu). Is there a better way
of doing this then mimic'ing the javascript to change the property of hidden
to visible? And how would one make the layer disappear again after the mouse
moved away? I'm sure the use of layers is probably the wrong thing to do
& need to set up an event handler for the mouse instead.
Thanks,
Lara
-
Re: Mimic'ing hidden/visible layers
In article <3998b7c1$1@news.devx.com>, Lara Fabans <lara@flashcom.net> wrote:
>Loved the book (sorry to gush).
Hi Lara, and thank you!
>I'm at a loss for how to start (I'm still pretty new at JSP) setting up
>a hidden layer to mimic a layer becoming visible when the mouse clicks a
>button
Layers and JSPs are meant to solve two slightly different problems.
Layers and DHTML are meant to make pages 'dynamic' in the sense that
the respond immediately to the user. JSPs are meant to make pages
'dynamic' in the sense that the server can customize each page for the
user at the time the page is first generated.
In fact, I would say that Layers and JSPs can compliment each other
quite nicely, rather than one being a replacement for the other. Two
great tastes that taste great together...
Here's a simple HTML page that uses a layer to describe a link when
the mouse passes over it. The original version of this came from
Randy Bennett, rbennett@thezone.net, and I found it through
http://javascript.internet.com "the Javascript Source".
<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function setupDescriptions() {
var x = navigator.appVersion;
y = x.substring(0,4);
if (y>=4) setVariables();
}
var x,y,a,b;
function setVariables(){
if (navigator.appName == "Netscape") {
h = ".left=";
v = ".top=";
dS = "document.";
ar sD = "";
} else {
h = ".pixelLeft=";
v = ".pixelTop=";
dS = "";
sD = ".style";
}
}
v isNav = (navigator.appName.indexOf("Netscape") !=-1);
function popLayer(a){
desc = "<table cellpadding=3 border=1 bgcolor=F7F7F7><td>";
if (a==1) desc += "Comedy with a 'Runch'";
desc += "</td></table>";
if(isNav) {
document.object1.document.write(desc);
document.object1.document.close();
document.object1.left=x+25;
document.object1.top=y;
} else {
object1.innerHTML=desc;
eval(dS+"object1"+sD+h+(x+25));
eval(dS+"object1"+sD+v+y);
}
}
function hideLayer(a) {
if(isNav) {
eval(document.object1.top=a);
} else {
object1.innerHTML="";
}
}
function handlerMM(e) {
x = (isNav) ? e.pageX : event.clientX;
y = (isNav) ? e.pageY : event.clientY;
}
if (isNav) {
document.captureEvents(Event.MOUSEMOVE);
}
document.onmousemove = handlerMM;
// End -->
</script>
</head>
<BODY OnLoad="setupDescriptions()">
<div id="object1"
style="position:absolute; visibility:show; left:25px; top:-50px; z-index:2">layer hidden off the screen</div>
<a href="http://www.brunching.com"
onMouseOver="popLayer(1)"
onMouseOut="hideLayer(-50)">The Brunching Shuttlecocks</a>
</body>
</html>
This works fine, but it shows the same URL and rollover to every user
who visits your page. If you wanted to allow some sort of
customization you could use a JSP to generate this page, and insert
the name of the site, the URL, and the text for the rollover. This
isn't something you could do with a layer, since layers have no way to
store information about users preferences, but JSPs can.
To do this we would need a bean to access this data, let's assume we
have one called userURL, which has methods called getURL(), getName(),
and getDescription(). To glue these together, you would just need to
change one line in popLayer to:
if (a==1) desc += "<jsp:getProperty name="userURL" property="Description">";
And change the link at the bottom of the page to:
<a href="<jsp:getProperty name="userURL" property="URL">"
onMouseOver="popLayer(1)"
onMouseOut="hideLayer(-50)"><jsp:getProperty name="userURL"
property="name"></a>
When the server generates the page it will replace all the getProperty
tags with the values, so when the JavaScript runs later, in the
browser, everything will look normal.
>And how would one make the layer disappear again after the mouse
>moved away? I'm sure the use of layers is probably the wrong thing to do
>& need to set up an event handler for the mouse instead.
In this case I think layers probably are the right thing, since there
is no other way for the browser to respond to the user without the user
needing to click something. However, JSPs can tailor the whole
experience for the particular user. Obviously mixing JSP and
JavaScript code can get ugly, but you could probably hide this all in
a couple of JSP includes.
- Larne
Similar Threads
-
By Patrik Persson in forum Web
Replies: 3
Last Post: 06-10-2002, 03:54 PM
-
By moritz moeller in forum Web
Replies: 0
Last Post: 10-03-2001, 06:45 AM
-
Replies: 10
Last Post: 07-30-2001, 11:33 PM
-
By Lesley Carter in forum Web
Replies: 0
Last Post: 03-06-2001, 01:02 PM
-
By Donna Brown in forum Web
Replies: 1
Last Post: 12-28-2000, 02:06 PM
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
Forum Rules
|
Top DevX Stories
Easy Web Services with SQL Server 2005 HTTP Endpoints
JavaOne 2005: Java Platform Roadmap Focuses on Ease of Development, Sun Focuses on the "Free" in F.O.S.S.
Wed Yourself to UML with the Power of Associations
Microsoft to Add AJAX Capabilities to ASP.NET
IBM's Cloudscape Versus MySQL
|
Bookmarks