Pages load in a herky-jerky (not smooth) manner

  • Thread starter Thread starter Guest
  • Start date Start date
G

Guest

Has a flashing effect. Part of a page loads, quickly followed by the the
rest of the page. The pictures are not complex - most are text only. Using
a Frontpage 2003 theme.

See www.godoers.com

Any ideas on how I can make the page loading smoother (and easier on the
eyes).
 
It normal for the browser to render the page as it gets the content. It
doesn't wait until it has everything and then display the page.

Regards Jens Peter Karlsen. Microsoft MVP - Frontpage.
 
I had the same problem (see my earlier post) AND we have something in common:
a Javascript in the page header that is for "preloading graphics." It looks
like something added by FrontPage.

To you Microsoft MVPs (or a Javascript Guru!), would this script cause the
flashing that is happening??? I tend to think it is doing it, but I can't
seem to remove it. Note that I had a rotating graphic in my header, but I've
removed it (site is natureschef.com).

Thanks in advance for your comments!!

Here's the script:
<script language="JavaScript">
<!--
function FP_swapImg() {//v1.0
var doc=document,args=arguments,elm,n; doc.$imgSwaps=new Array(); for(n=2;
n<args.length;
n+=2) { elm=FP_getObjectByID(args[n]); if(elm) {
doc.$imgSwaps[doc.$imgSwaps.length]=elm;
elm.$src=elm.src; elm.src=args[n+1]; } }
}

function FP_preloadImgs() {//v1.0
var d=document,a=arguments; if(!d.FP_imgs) d.FP_imgs=new Array();
for(var i=0; i<a.length; i++) { d.FP_imgs=new Image;
d.FP_imgs.src=a; }
}

function FP_getObjectByID(id,o) {//v1.0
var c,el,els,f,m,n; if(!o)o=document; if(o.getElementById)
el=o.getElementById(id);
else if(o.layers) c=o.layers; else if(o.all) el=o.all[id]; if(el) return el;
if(o.id==id || o.name==id) return o; if(o.childNodes) c=o.childNodes; if(c)
for(n=0; n<c.length; n++) { el=FP_getObjectByID(id,c[n]); if(el) return el; }
f=o.forms; if(f) for(n=0; n<f.length; n++) { els=f[n].elements;
for(m=0; m<els.length; m++){ el=FP_getObjectByID(id,els[n]); if(el) return
el; } }
return null;
}
// -->
</script>
 
If the images are large (heavy) then yes, it could cause that, but remember,
once the images have been cached, they will be pulled from the cache, so
this means that there are two scenarios -

1. Leave the preload in - the page loads herky-jerky because of the
preload, but the rendering is instantaneous from the cache
2. Take the preload out - the page loads herky-jerky during the render
because of the page's fetching of those images

The point is - pay attention to your heavy images to manage this.

--
Murray
============

Diana O said:
I had the same problem (see my earlier post) AND we have something in
common:
a Javascript in the page header that is for "preloading graphics." It
looks
like something added by FrontPage.

To you Microsoft MVPs (or a Javascript Guru!), would this script cause the
flashing that is happening??? I tend to think it is doing it, but I can't
seem to remove it. Note that I had a rotating graphic in my header, but
I've
removed it (site is natureschef.com).

Thanks in advance for your comments!!

Here's the script:
<script language="JavaScript">
<!--
function FP_swapImg() {//v1.0
var doc=document,args=arguments,elm,n; doc.$imgSwaps=new Array(); for(n=2;
n<args.length;
n+=2) { elm=FP_getObjectByID(args[n]); if(elm) {
doc.$imgSwaps[doc.$imgSwaps.length]=elm;
elm.$src=elm.src; elm.src=args[n+1]; } }
}

function FP_preloadImgs() {//v1.0
var d=document,a=arguments; if(!d.FP_imgs) d.FP_imgs=new Array();
for(var i=0; i<a.length; i++) { d.FP_imgs=new Image;
d.FP_imgs.src=a; }
}

function FP_getObjectByID(id,o) {//v1.0
var c,el,els,f,m,n; if(!o)o=document; if(o.getElementById)
el=o.getElementById(id);
else if(o.layers) c=o.layers; else if(o.all) el=o.all[id]; if(el) return
el;
if(o.id==id || o.name==id) return o; if(o.childNodes) c=o.childNodes;
if(c)
for(n=0; n<c.length; n++) { el=FP_getObjectByID(id,c[n]); if(el) return
el; }
f=o.forms; if(f) for(n=0; n<f.length; n++) { els=f[n].elements;
for(m=0; m<els.length; m++){ el=FP_getObjectByID(id,els[n]); if(el) return
el; } }
return null;
}
// -->
</script>



Jens Peter Karlsen said:
It normal for the browser to render the page as it gets the content. It
doesn't wait until it has everything and then display the page.

Regards Jens Peter Karlsen. Microsoft MVP - Frontpage.
 
True, but some of the pages do not have images except in the header. Those
also flash when the page loads when changing from one page to another.

Also, logically, I would think that changing from page to page with the nav
buttons would cause each page to flash *one* time on load, and stop flashing
after the first load (if in fact they are reloaded from cache). That is not
the case here. The page flashes every time :-(

Murray said:
If the images are large (heavy) then yes, it could cause that, but remember,
once the images have been cached, they will be pulled from the cache, so
this means that there are two scenarios -

1. Leave the preload in - the page loads herky-jerky because of the
preload, but the rendering is instantaneous from the cache
2. Take the preload out - the page loads herky-jerky during the render
because of the page's fetching of those images

The point is - pay attention to your heavy images to manage this.

--
Murray
============

Diana O said:
I had the same problem (see my earlier post) AND we have something in
common:
a Javascript in the page header that is for "preloading graphics." It
looks
like something added by FrontPage.

To you Microsoft MVPs (or a Javascript Guru!), would this script cause the
flashing that is happening??? I tend to think it is doing it, but I can't
seem to remove it. Note that I had a rotating graphic in my header, but
I've
removed it (site is natureschef.com).

Thanks in advance for your comments!!

Here's the script:
<script language="JavaScript">
<!--
function FP_swapImg() {//v1.0
var doc=document,args=arguments,elm,n; doc.$imgSwaps=new Array(); for(n=2;
n<args.length;
n+=2) { elm=FP_getObjectByID(args[n]); if(elm) {
doc.$imgSwaps[doc.$imgSwaps.length]=elm;
elm.$src=elm.src; elm.src=args[n+1]; } }
}

function FP_preloadImgs() {//v1.0
var d=document,a=arguments; if(!d.FP_imgs) d.FP_imgs=new Array();
for(var i=0; i<a.length; i++) { d.FP_imgs=new Image;
d.FP_imgs.src=a; }
}

function FP_getObjectByID(id,o) {//v1.0
var c,el,els,f,m,n; if(!o)o=document; if(o.getElementById)
el=o.getElementById(id);
else if(o.layers) c=o.layers; else if(o.all) el=o.all[id]; if(el) return
el;
if(o.id==id || o.name==id) return o; if(o.childNodes) c=o.childNodes;
if(c)
for(n=0; n<c.length; n++) { el=FP_getObjectByID(id,c[n]); if(el) return
el; }
f=o.forms; if(f) for(n=0; n<f.length; n++) { els=f[n].elements;
for(m=0; m<els.length; m++){ el=FP_getObjectByID(id,els[n]); if(el) return
el; } }
return null;
}
// -->
</script>



Jens Peter Karlsen said:
It normal for the browser to render the page as it gets the content. It
doesn't wait until it has everything and then display the page.

Regards Jens Peter Karlsen. Microsoft MVP - Frontpage.

jsccorps wrote:
Has a flashing effect. Part of a page loads, quickly followed by the
the
rest of the page. The pictures are not complex - most are text only.
Using
a Frontpage 2003 theme.

See www.godoers.com

Any ideas on how I can make the page loading smoother (and easier on
the
eyes).

 
I may have found the answer, posted on another board, from Jim Buyens
Microsoft FrontPage MVP, http://www.interlacken.com. I am pretty sure this
is it, but I will report back after checking my site for this. Read on:

QUOTE: This is probably because you're getting more onmouseout
events than you expect.

In DHTML, the mouse can only be "over" one element at a
time. So, if you have a hyperlink inside a DIV, the mouse
is over the DIV until you move it over the hyperlink.

When the mouse is over the hyperlink, it's no longer over
the DIV, so the DIV's onmouseout event fires and the DIV
goes invisible.

If you try to battle this by capturing onmouseovers on the
hyperlink and making the DIV visible again, you get
flicker as the DIV goes hidden and visible.

Bottom line, capturing the onmouseout event isn't a good
way to detect when the mouse passes outside the boundaries
of the DIV. One alternative is to put the menu layer at z-
order:2, and make another big layer that contains a
transparent GIF picture at z-order:1. Then:

o When you want to display the menu layer, display the
transparent GIF layer as well.
o When the transparent GIF layer gets onmouseover, hide
both that layer and the menu layer.

There are also various approaches for doing this with
scripts. For example, you can capture onmousemove events
and watch for the mouse coordinates to be outside the menu
layer. But you can't do this using only the FrontPage GUI;
you have to work in Code view.

Jim Buyens
Microsoft FrontPage MVP ENDQUOTE



Diana O said:
I had the same problem (see my earlier post) AND we have something in common:
a Javascript in the page header that is for "preloading graphics." It looks
like something added by FrontPage.

To you Microsoft MVPs (or a Javascript Guru!), would this script cause the
flashing that is happening??? I tend to think it is doing it, but I can't
seem to remove it. Note that I had a rotating graphic in my header, but I've
removed it (site is natureschef.com).

Thanks in advance for your comments!!

Here's the script:
<script language="JavaScript">
<!--
function FP_swapImg() {//v1.0
var doc=document,args=arguments,elm,n; doc.$imgSwaps=new Array(); for(n=2;
n<args.length;
n+=2) { elm=FP_getObjectByID(args[n]); if(elm) {
doc.$imgSwaps[doc.$imgSwaps.length]=elm;
elm.$src=elm.src; elm.src=args[n+1]; } }
}

function FP_preloadImgs() {//v1.0
var d=document,a=arguments; if(!d.FP_imgs) d.FP_imgs=new Array();
for(var i=0; i<a.length; i++) { d.FP_imgs=new Image;
d.FP_imgs.src=a; }
}

function FP_getObjectByID(id,o) {//v1.0
var c,el,els,f,m,n; if(!o)o=document; if(o.getElementById)
el=o.getElementById(id);
else if(o.layers) c=o.layers; else if(o.all) el=o.all[id]; if(el) return el;
if(o.id==id || o.name==id) return o; if(o.childNodes) c=o.childNodes; if(c)
for(n=0; n<c.length; n++) { el=FP_getObjectByID(id,c[n]); if(el) return el; }
f=o.forms; if(f) for(n=0; n<f.length; n++) { els=f[n].elements;
for(m=0; m<els.length; m++){ el=FP_getObjectByID(id,els[n]); if(el) return
el; } }
return null;
}
// -->
</script>



Jens Peter Karlsen said:
It normal for the browser to render the page as it gets the content. It
doesn't wait until it has everything and then display the page.

Regards Jens Peter Karlsen. Microsoft MVP - Frontpage.
 
I've just looked at several FrontPage-created sites, and guess what? They ALL
do the same thing: flash on page changes. And the JS is the same in each. The
others are not graphic intensive either.

I think what we have here is a FP2003 Bug.
See http://www.ucss.com/software.htm. Does the same thing as my site. Hmm.

Diana O said:
I may have found the answer, posted on another board, from Jim Buyens
Microsoft FrontPage MVP, http://www.interlacken.com. I am pretty sure this
is it, but I will report back after checking my site for this. Read on:

QUOTE: This is probably because you're getting more onmouseout
events than you expect.

In DHTML, the mouse can only be "over" one element at a
time. So, if you have a hyperlink inside a DIV, the mouse
is over the DIV until you move it over the hyperlink.

When the mouse is over the hyperlink, it's no longer over
the DIV, so the DIV's onmouseout event fires and the DIV
goes invisible.

If you try to battle this by capturing onmouseovers on the
hyperlink and making the DIV visible again, you get
flicker as the DIV goes hidden and visible.

Bottom line, capturing the onmouseout event isn't a good
way to detect when the mouse passes outside the boundaries
of the DIV. One alternative is to put the menu layer at z-
order:2, and make another big layer that contains a
transparent GIF picture at z-order:1. Then:

o When you want to display the menu layer, display the
transparent GIF layer as well.
o When the transparent GIF layer gets onmouseover, hide
both that layer and the menu layer.

There are also various approaches for doing this with
scripts. For example, you can capture onmousemove events
and watch for the mouse coordinates to be outside the menu
layer. But you can't do this using only the FrontPage GUI;
you have to work in Code view.

Jim Buyens
Microsoft FrontPage MVP ENDQUOTE



Diana O said:
I had the same problem (see my earlier post) AND we have something in common:
a Javascript in the page header that is for "preloading graphics." It looks
like something added by FrontPage.

To you Microsoft MVPs (or a Javascript Guru!), would this script cause the
flashing that is happening??? I tend to think it is doing it, but I can't
seem to remove it. Note that I had a rotating graphic in my header, but I've
removed it (site is natureschef.com).

Thanks in advance for your comments!!

Here's the script:
<script language="JavaScript">
<!--
function FP_swapImg() {//v1.0
var doc=document,args=arguments,elm,n; doc.$imgSwaps=new Array(); for(n=2;
n<args.length;
n+=2) { elm=FP_getObjectByID(args[n]); if(elm) {
doc.$imgSwaps[doc.$imgSwaps.length]=elm;
elm.$src=elm.src; elm.src=args[n+1]; } }
}

function FP_preloadImgs() {//v1.0
var d=document,a=arguments; if(!d.FP_imgs) d.FP_imgs=new Array();
for(var i=0; i<a.length; i++) { d.FP_imgs=new Image;
d.FP_imgs.src=a; }
}

function FP_getObjectByID(id,o) {//v1.0
var c,el,els,f,m,n; if(!o)o=document; if(o.getElementById)
el=o.getElementById(id);
else if(o.layers) c=o.layers; else if(o.all) el=o.all[id]; if(el) return el;
if(o.id==id || o.name==id) return o; if(o.childNodes) c=o.childNodes; if(c)
for(n=0; n<c.length; n++) { el=FP_getObjectByID(id,c[n]); if(el) return el; }
f=o.forms; if(f) for(n=0; n<f.length; n++) { els=f[n].elements;
for(m=0; m<els.length; m++){ el=FP_getObjectByID(id,els[n]); if(el) return
el; } }
return null;
}
// -->
</script>



Jens Peter Karlsen said:
It normal for the browser to render the page as it gets the content. It
doesn't wait until it has everything and then display the page.

Regards Jens Peter Karlsen. Microsoft MVP - Frontpage.

jsccorps wrote:
Has a flashing effect. Part of a page loads, quickly followed by the the
rest of the page. The pictures are not complex - most are text only. Using
a Frontpage 2003 theme.

See www.godoers.com

Any ideas on how I can make the page loading smoother (and easier on the
eyes).
 
I don't see the herky-jerky,,,but you may want to remove page-transitions on
a couple of pages and see if that helps.



Diana O said:
True, but some of the pages do not have images except in the header. Those
also flash when the page loads when changing from one page to another.

Also, logically, I would think that changing from page to page with the
nav
buttons would cause each page to flash *one* time on load, and stop
flashing
after the first load (if in fact they are reloaded from cache). That is
not
the case here. The page flashes every time :-(

Murray said:
If the images are large (heavy) then yes, it could cause that, but
remember,
once the images have been cached, they will be pulled from the cache, so
this means that there are two scenarios -

1. Leave the preload in - the page loads herky-jerky because of the
preload, but the rendering is instantaneous from the cache
2. Take the preload out - the page loads herky-jerky during the render
because of the page's fetching of those images

The point is - pay attention to your heavy images to manage this.

--
Murray
============

Diana O said:
I had the same problem (see my earlier post) AND we have something in
common:
a Javascript in the page header that is for "preloading graphics." It
looks
like something added by FrontPage.

To you Microsoft MVPs (or a Javascript Guru!), would this script cause
the
flashing that is happening??? I tend to think it is doing it, but I
can't
seem to remove it. Note that I had a rotating graphic in my header, but
I've
removed it (site is natureschef.com).

Thanks in advance for your comments!!

Here's the script:
<script language="JavaScript">
<!--
function FP_swapImg() {//v1.0
var doc=document,args=arguments,elm,n; doc.$imgSwaps=new Array();
for(n=2;
n<args.length;
n+=2) { elm=FP_getObjectByID(args[n]); if(elm) {
doc.$imgSwaps[doc.$imgSwaps.length]=elm;
elm.$src=elm.src; elm.src=args[n+1]; } }
}

function FP_preloadImgs() {//v1.0
var d=document,a=arguments; if(!d.FP_imgs) d.FP_imgs=new Array();
for(var i=0; i<a.length; i++) { d.FP_imgs=new Image;
d.FP_imgs.src=a; }
}

function FP_getObjectByID(id,o) {//v1.0
var c,el,els,f,m,n; if(!o)o=document; if(o.getElementById)
el=o.getElementById(id);
else if(o.layers) c=o.layers; else if(o.all) el=o.all[id]; if(el)
return
el;
if(o.id==id || o.name==id) return o; if(o.childNodes) c=o.childNodes;
if(c)
for(n=0; n<c.length; n++) { el=FP_getObjectByID(id,c[n]); if(el) return
el; }
f=o.forms; if(f) for(n=0; n<f.length; n++) { els=f[n].elements;
for(m=0; m<els.length; m++){ el=FP_getObjectByID(id,els[n]); if(el)
return
el; } }
return null;
}
// -->
</script>



:

It normal for the browser to render the page as it gets the content.
It
doesn't wait until it has everything and then display the page.

Regards Jens Peter Karlsen. Microsoft MVP - Frontpage.

jsccorps wrote:
Has a flashing effect. Part of a page loads, quickly followed by
the
the
rest of the page. The pictures are not complex - most are text
only.
Using
a Frontpage 2003 theme.

See www.godoers.com

Any ideas on how I can make the page loading smoother (and easier on
the
eyes).

 
How do you have your browser set to cache pages?

--
==============================================
Thomas A. Rowe (Microsoft MVP - FrontPage)
==============================================
If you feel your current issue is a results of installing
a Service Pack or security update, please contact
Microsoft Product Support Services:
http://support.microsoft.com
If the problem can be shown to have been caused by a
security update, then there is usually no charge for the call.
==============================================

Diana O said:
I've just looked at several FrontPage-created sites, and guess what? They ALL
do the same thing: flash on page changes. And the JS is the same in each. The
others are not graphic intensive either.

I think what we have here is a FP2003 Bug.
See http://www.ucss.com/software.htm. Does the same thing as my site. Hmm.

Diana O said:
I may have found the answer, posted on another board, from Jim Buyens
Microsoft FrontPage MVP, http://www.interlacken.com. I am pretty sure this
is it, but I will report back after checking my site for this. Read on:

QUOTE: This is probably because you're getting more onmouseout
events than you expect.

In DHTML, the mouse can only be "over" one element at a
time. So, if you have a hyperlink inside a DIV, the mouse
is over the DIV until you move it over the hyperlink.

When the mouse is over the hyperlink, it's no longer over
the DIV, so the DIV's onmouseout event fires and the DIV
goes invisible.

If you try to battle this by capturing onmouseovers on the
hyperlink and making the DIV visible again, you get
flicker as the DIV goes hidden and visible.

Bottom line, capturing the onmouseout event isn't a good
way to detect when the mouse passes outside the boundaries
of the DIV. One alternative is to put the menu layer at z-
order:2, and make another big layer that contains a
transparent GIF picture at z-order:1. Then:

o When you want to display the menu layer, display the
transparent GIF layer as well.
o When the transparent GIF layer gets onmouseover, hide
both that layer and the menu layer.

There are also various approaches for doing this with
scripts. For example, you can capture onmousemove events
and watch for the mouse coordinates to be outside the menu
layer. But you can't do this using only the FrontPage GUI;
you have to work in Code view.

Jim Buyens
Microsoft FrontPage MVP ENDQUOTE



Diana O said:
I had the same problem (see my earlier post) AND we have something in common:
a Javascript in the page header that is for "preloading graphics." It looks
like something added by FrontPage.

To you Microsoft MVPs (or a Javascript Guru!), would this script cause the
flashing that is happening??? I tend to think it is doing it, but I can't
seem to remove it. Note that I had a rotating graphic in my header, but I've
removed it (site is natureschef.com).

Thanks in advance for your comments!!

Here's the script:
<script language="JavaScript">
<!--
function FP_swapImg() {//v1.0
var doc=document,args=arguments,elm,n; doc.$imgSwaps=new Array(); for(n=2;
n<args.length;
n+=2) { elm=FP_getObjectByID(args[n]); if(elm) {
doc.$imgSwaps[doc.$imgSwaps.length]=elm;
elm.$src=elm.src; elm.src=args[n+1]; } }
}

function FP_preloadImgs() {//v1.0
var d=document,a=arguments; if(!d.FP_imgs) d.FP_imgs=new Array();
for(var i=0; i<a.length; i++) { d.FP_imgs=new Image;
d.FP_imgs.src=a; }
}

function FP_getObjectByID(id,o) {//v1.0
var c,el,els,f,m,n; if(!o)o=document; if(o.getElementById)
el=o.getElementById(id);
else if(o.layers) c=o.layers; else if(o.all) el=o.all[id]; if(el) return el;
if(o.id==id || o.name==id) return o; if(o.childNodes) c=o.childNodes; if(c)
for(n=0; n<c.length; n++) { el=FP_getObjectByID(id,c[n]); if(el) return el; }
f=o.forms; if(f) for(n=0; n<f.length; n++) { els=f[n].elements;
for(m=0; m<els.length; m++){ el=FP_getObjectByID(id,els[n]); if(el) return
el; } }
return null;
}
// -->
</script>



:

It normal for the browser to render the page as it gets the content. It
doesn't wait until it has everything and then display the page.

Regards Jens Peter Karlsen. Microsoft MVP - Frontpage.

jsccorps wrote:
Has a flashing effect. Part of a page loads, quickly followed by the the
rest of the page. The pictures are not complex - most are text only. Using
a Frontpage 2003 theme.

See www.godoers.com

Any ideas on how I can make the page loading smoother (and easier on the
eyes).
 
That page is about 5 times heavier than it should be -

Global Statistics
Total HTTP Requests: 32
Total Size: 92909 bytes

Object Size Totals
Object type Size (bytes)
HTML: 33314
HTML Images: 59595
CSS Images: 0
Total Images: 59595
Javascript: 0
CSS: 0
Multimedia: 0
Other: 0

External Objects
External Object QTY
Total HTML: 1
Total HTML Images: 31
Total CSS Images: 0
Total Images: 31
Total Scripts: 0
Total CSS imports: 0
Total Frames: 0
Total Iframes: 0


But, I don't see herky-jerky loading or any flickering like you are
describing - can you tell me where to look?

Or are you talking about the flickering as you mouse over the menu options
on the left? That's a combination of sloppy programming and weirdness in
FP. So you are sorta right.

1. Event handlers applied directly to <td> or <img> tags asks (begs, even)
for poor browser support - it's far better to just use an <a> tag wrapping
each image for the behaviors than to apply them directly into the image tag.
2. It would be a simple matter to make the <a> tags display:block in those
table cells, thereby filling the cell completely - then you wouldn't see the
flickering at all.
3. I am not sure why FP adds all those additional event handlers to these
behaviors, e.g., onmousedown, onmouseup, ondblclick, etc. A simple
onmouseover is adequate to trigger a fly out menu such as shown there, with
onmouseout to restore.

--
Murray
============

Diana O said:
I've just looked at several FrontPage-created sites, and guess what? They
ALL
do the same thing: flash on page changes. And the JS is the same in each.
The
others are not graphic intensive either.

I think what we have here is a FP2003 Bug.
See http://www.ucss.com/software.htm. Does the same thing as my site. Hmm.

Diana O said:
I may have found the answer, posted on another board, from Jim Buyens
Microsoft FrontPage MVP, http://www.interlacken.com. I am pretty sure
this
is it, but I will report back after checking my site for this. Read on:

QUOTE: This is probably because you're getting more onmouseout
events than you expect.

In DHTML, the mouse can only be "over" one element at a
time. So, if you have a hyperlink inside a DIV, the mouse
is over the DIV until you move it over the hyperlink.

When the mouse is over the hyperlink, it's no longer over
the DIV, so the DIV's onmouseout event fires and the DIV
goes invisible.

If you try to battle this by capturing onmouseovers on the
hyperlink and making the DIV visible again, you get
flicker as the DIV goes hidden and visible.

Bottom line, capturing the onmouseout event isn't a good
way to detect when the mouse passes outside the boundaries
of the DIV. One alternative is to put the menu layer at z-
order:2, and make another big layer that contains a
transparent GIF picture at z-order:1. Then:

o When you want to display the menu layer, display the
transparent GIF layer as well.
o When the transparent GIF layer gets onmouseover, hide
both that layer and the menu layer.

There are also various approaches for doing this with
scripts. For example, you can capture onmousemove events
and watch for the mouse coordinates to be outside the menu
layer. But you can't do this using only the FrontPage GUI;
you have to work in Code view.

Jim Buyens
Microsoft FrontPage MVP ENDQUOTE



Diana O said:
I had the same problem (see my earlier post) AND we have something in
common:
a Javascript in the page header that is for "preloading graphics." It
looks
like something added by FrontPage.

To you Microsoft MVPs (or a Javascript Guru!), would this script cause
the
flashing that is happening??? I tend to think it is doing it, but I
can't
seem to remove it. Note that I had a rotating graphic in my header, but
I've
removed it (site is natureschef.com).

Thanks in advance for your comments!!

Here's the script:
<script language="JavaScript">
<!--
function FP_swapImg() {//v1.0
var doc=document,args=arguments,elm,n; doc.$imgSwaps=new Array();
for(n=2;
n<args.length;
n+=2) { elm=FP_getObjectByID(args[n]); if(elm) {
doc.$imgSwaps[doc.$imgSwaps.length]=elm;
elm.$src=elm.src; elm.src=args[n+1]; } }
}

function FP_preloadImgs() {//v1.0
var d=document,a=arguments; if(!d.FP_imgs) d.FP_imgs=new Array();
for(var i=0; i<a.length; i++) { d.FP_imgs=new Image;
d.FP_imgs.src=a; }
}

function FP_getObjectByID(id,o) {//v1.0
var c,el,els,f,m,n; if(!o)o=document; if(o.getElementById)
el=o.getElementById(id);
else if(o.layers) c=o.layers; else if(o.all) el=o.all[id]; if(el)
return el;
if(o.id==id || o.name==id) return o; if(o.childNodes) c=o.childNodes;
if(c)
for(n=0; n<c.length; n++) { el=FP_getObjectByID(id,c[n]); if(el)
return el; }
f=o.forms; if(f) for(n=0; n<f.length; n++) { els=f[n].elements;
for(m=0; m<els.length; m++){ el=FP_getObjectByID(id,els[n]); if(el)
return
el; } }
return null;
}
// -->
</script>



:

It normal for the browser to render the page as it gets the content.
It
doesn't wait until it has everything and then display the page.

Regards Jens Peter Karlsen. Microsoft MVP - Frontpage.

jsccorps wrote:
Has a flashing effect. Part of a page loads, quickly followed by
the the
rest of the page. The pictures are not complex - most are text
only. Using
a Frontpage 2003 theme.

See www.godoers.com

Any ideas on how I can make the page loading smoother (and easier
on the
eyes).
 
FP Interactive Buttons only adds events for the 3 states
- default (restore), hover, & pressed as:
onmouseover, onmouseout, onmousedown, onmouseup

Anything else on that page was added by the user as a behavior or additional script

--




| That page is about 5 times heavier than it should be -
|
| Global Statistics
| Total HTTP Requests: 32
| Total Size: 92909 bytes
|
| Object Size Totals
| Object type Size (bytes)
| HTML: 33314
| HTML Images: 59595
| CSS Images: 0
| Total Images: 59595
| Javascript: 0
| CSS: 0
| Multimedia: 0
| Other: 0
|
| External Objects
| External Object QTY
| Total HTML: 1
| Total HTML Images: 31
| Total CSS Images: 0
| Total Images: 31
| Total Scripts: 0
| Total CSS imports: 0
| Total Frames: 0
| Total Iframes: 0
|
|
| But, I don't see herky-jerky loading or any flickering like you are
| describing - can you tell me where to look?
|
| Or are you talking about the flickering as you mouse over the menu options
| on the left? That's a combination of sloppy programming and weirdness in
| FP. So you are sorta right.
|
| 1. Event handlers applied directly to <td> or <img> tags asks (begs, even)
| for poor browser support - it's far better to just use an <a> tag wrapping
| each image for the behaviors than to apply them directly into the image tag.
| 2. It would be a simple matter to make the <a> tags display:block in those
| table cells, thereby filling the cell completely - then you wouldn't see the
| flickering at all.
| 3. I am not sure why FP adds all those additional event handlers to these
| behaviors, e.g., onmousedown, onmouseup, ondblclick, etc. A simple
| onmouseover is adequate to trigger a fly out menu such as shown there, with
| onmouseout to restore.
|
| --
| Murray
| ============
|
| | > I've just looked at several FrontPage-created sites, and guess what? They
| > ALL
| > do the same thing: flash on page changes. And the JS is the same in each.
| > The
| > others are not graphic intensive either.
| >
| > I think what we have here is a FP2003 Bug.
| > See http://www.ucss.com/software.htm. Does the same thing as my site. Hmm.
| >
| > "Diana O" wrote:
| >
| >> I may have found the answer, posted on another board, from Jim Buyens
| >> Microsoft FrontPage MVP, http://www.interlacken.com. I am pretty sure
| >> this
| >> is it, but I will report back after checking my site for this. Read on:
| >>
| >> QUOTE: This is probably because you're getting more onmouseout
| >> events than you expect.
| >>
| >> In DHTML, the mouse can only be "over" one element at a
| >> time. So, if you have a hyperlink inside a DIV, the mouse
| >> is over the DIV until you move it over the hyperlink.
| >>
| >> When the mouse is over the hyperlink, it's no longer over
| >> the DIV, so the DIV's onmouseout event fires and the DIV
| >> goes invisible.
| >>
| >> If you try to battle this by capturing onmouseovers on the
| >> hyperlink and making the DIV visible again, you get
| >> flicker as the DIV goes hidden and visible.
| >>
| >> Bottom line, capturing the onmouseout event isn't a good
| >> way to detect when the mouse passes outside the boundaries
| >> of the DIV. One alternative is to put the menu layer at z-
| >> order:2, and make another big layer that contains a
| >> transparent GIF picture at z-order:1. Then:
| >>
| >> o When you want to display the menu layer, display the
| >> transparent GIF layer as well.
| >> o When the transparent GIF layer gets onmouseover, hide
| >> both that layer and the menu layer.
| >>
| >> There are also various approaches for doing this with
| >> scripts. For example, you can capture onmousemove events
| >> and watch for the mouse coordinates to be outside the menu
| >> layer. But you can't do this using only the FrontPage GUI;
| >> you have to work in Code view.
| >>
| >> Jim Buyens
| >> Microsoft FrontPage MVP ENDQUOTE
| >>
| >>
| >>
| >> "Diana O" wrote:
| >>
| >> > I had the same problem (see my earlier post) AND we have something in
| >> > common:
| >> > a Javascript in the page header that is for "preloading graphics." It
| >> > looks
| >> > like something added by FrontPage.
| >> >
| >> > To you Microsoft MVPs (or a Javascript Guru!), would this script cause
| >> > the
| >> > flashing that is happening??? I tend to think it is doing it, but I
| >> > can't
| >> > seem to remove it. Note that I had a rotating graphic in my header, but
| >> > I've
| >> > removed it (site is natureschef.com).
| >> >
| >> > Thanks in advance for your comments!!
| >> >
| >> > Here's the script:
| >> > <script language="JavaScript">
| >> > <!--
| >> > function FP_swapImg() {//v1.0
| >> > var doc=document,args=arguments,elm,n; doc.$imgSwaps=new Array();
| >> > for(n=2;
| >> > n<args.length;
| >> > n+=2) { elm=FP_getObjectByID(args[n]); if(elm) {
| >> > doc.$imgSwaps[doc.$imgSwaps.length]=elm;
| >> > elm.$src=elm.src; elm.src=args[n+1]; } }
| >> > }
| >> >
| >> > function FP_preloadImgs() {//v1.0
| >> > var d=document,a=arguments; if(!d.FP_imgs) d.FP_imgs=new Array();
| >> > for(var i=0; i<a.length; i++) { d.FP_imgs=new Image;
| >> > d.FP_imgs.src=a; }
| >> > }
| >> >
| >> > function FP_getObjectByID(id,o) {//v1.0
| >> > var c,el,els,f,m,n; if(!o)o=document; if(o.getElementById)
| >> > el=o.getElementById(id);
| >> > else if(o.layers) c=o.layers; else if(o.all) el=o.all[id]; if(el)
| >> > return el;
| >> > if(o.id==id || o.name==id) return o; if(o.childNodes) c=o.childNodes;
| >> > if(c)
| >> > for(n=0; n<c.length; n++) { el=FP_getObjectByID(id,c[n]); if(el)
| >> > return el; }
| >> > f=o.forms; if(f) for(n=0; n<f.length; n++) { els=f[n].elements;
| >> > for(m=0; m<els.length; m++){ el=FP_getObjectByID(id,els[n]); if(el)
| >> > return
| >> > el; } }
| >> > return null;
| >> > }
| >> > // -->
| >> > </script>
| >> >
| >> >
| >> >
| >> > "Jens Peter Karlsen [FP MVP]" wrote:
| >> >
| >> > > It normal for the browser to render the page as it gets the content.
| >> > > It
| >> > > doesn't wait until it has everything and then display the page.
| >> > >
| >> > > Regards Jens Peter Karlsen. Microsoft MVP - Frontpage.
| >> > >
| >> > > jsccorps wrote:
| >> > > > Has a flashing effect. Part of a page loads, quickly followed by
| >> > > > the the
| >> > > > rest of the page. The pictures are not complex - most are text
| >> > > > only. Using
| >> > > > a Frontpage 2003 theme.
| >> > > >
| >> > > > See www.godoers.com
| >> > > >
| >> > > > Any ideas on how I can make the page loading smoother (and easier
| >> > > > on the
| >> > > > eyes).
| >> > > >
| >> > >
|
|
 
Why is it necessary to add the onmousedown and onmouseup? Those are
redundant events.

--
Murray
============

Stefan B Rusynko said:
FP Interactive Buttons only adds events for the 3 states
- default (restore), hover, & pressed as:
onmouseover, onmouseout, onmousedown, onmouseup

Anything else on that page was added by the user as a behavior or
additional script

--




| That page is about 5 times heavier than it should be -
|
| Global Statistics
| Total HTTP Requests: 32
| Total Size: 92909 bytes
|
| Object Size Totals
| Object type Size (bytes)
| HTML: 33314
| HTML Images: 59595
| CSS Images: 0
| Total Images: 59595
| Javascript: 0
| CSS: 0
| Multimedia: 0
| Other: 0
|
| External Objects
| External Object QTY
| Total HTML: 1
| Total HTML Images: 31
| Total CSS Images: 0
| Total Images: 31
| Total Scripts: 0
| Total CSS imports: 0
| Total Frames: 0
| Total Iframes: 0
|
|
| But, I don't see herky-jerky loading or any flickering like you are
| describing - can you tell me where to look?
|
| Or are you talking about the flickering as you mouse over the menu
options
| on the left? That's a combination of sloppy programming and weirdness
in
| FP. So you are sorta right.
|
| 1. Event handlers applied directly to <td> or <img> tags asks (begs,
even)
| for poor browser support - it's far better to just use an <a> tag
wrapping
| each image for the behaviors than to apply them directly into the image
tag.
| 2. It would be a simple matter to make the <a> tags display:block in
those
| table cells, thereby filling the cell completely - then you wouldn't see
the
| flickering at all.
| 3. I am not sure why FP adds all those additional event handlers to
these
| behaviors, e.g., onmousedown, onmouseup, ondblclick, etc. A simple
| onmouseover is adequate to trigger a fly out menu such as shown there,
with
| onmouseout to restore.
|
| --
| Murray
| ============
|
| | > I've just looked at several FrontPage-created sites, and guess what?
They
| > ALL
| > do the same thing: flash on page changes. And the JS is the same in
each.
| > The
| > others are not graphic intensive either.
| >
| > I think what we have here is a FP2003 Bug.
| > See http://www.ucss.com/software.htm. Does the same thing as my site.
Hmm.
| >
| > "Diana O" wrote:
| >
| >> I may have found the answer, posted on another board, from Jim Buyens
| >> Microsoft FrontPage MVP, http://www.interlacken.com. I am pretty sure
| >> this
| >> is it, but I will report back after checking my site for this. Read
on:
| >>
| >> QUOTE: This is probably because you're getting more onmouseout
| >> events than you expect.
| >>
| >> In DHTML, the mouse can only be "over" one element at a
| >> time. So, if you have a hyperlink inside a DIV, the mouse
| >> is over the DIV until you move it over the hyperlink.
| >>
| >> When the mouse is over the hyperlink, it's no longer over
| >> the DIV, so the DIV's onmouseout event fires and the DIV
| >> goes invisible.
| >>
| >> If you try to battle this by capturing onmouseovers on the
| >> hyperlink and making the DIV visible again, you get
| >> flicker as the DIV goes hidden and visible.
| >>
| >> Bottom line, capturing the onmouseout event isn't a good
| >> way to detect when the mouse passes outside the boundaries
| >> of the DIV. One alternative is to put the menu layer at z-
| >> order:2, and make another big layer that contains a
| >> transparent GIF picture at z-order:1. Then:
| >>
| >> o When you want to display the menu layer, display the
| >> transparent GIF layer as well.
| >> o When the transparent GIF layer gets onmouseover, hide
| >> both that layer and the menu layer.
| >>
| >> There are also various approaches for doing this with
| >> scripts. For example, you can capture onmousemove events
| >> and watch for the mouse coordinates to be outside the menu
| >> layer. But you can't do this using only the FrontPage GUI;
| >> you have to work in Code view.
| >>
| >> Jim Buyens
| >> Microsoft FrontPage MVP ENDQUOTE
| >>
| >>
| >>
| >> "Diana O" wrote:
| >>
| >> > I had the same problem (see my earlier post) AND we have something
in
| >> > common:
| >> > a Javascript in the page header that is for "preloading graphics."
It
| >> > looks
| >> > like something added by FrontPage.
| >> >
| >> > To you Microsoft MVPs (or a Javascript Guru!), would this script
cause
| >> > the
| >> > flashing that is happening??? I tend to think it is doing it, but I
| >> > can't
| >> > seem to remove it. Note that I had a rotating graphic in my header,
but
| >> > I've
| >> > removed it (site is natureschef.com).
| >> >
| >> > Thanks in advance for your comments!!
| >> >
| >> > Here's the script:
| >> > <script language="JavaScript">
| >> > <!--
| >> > function FP_swapImg() {//v1.0
| >> > var doc=document,args=arguments,elm,n; doc.$imgSwaps=new Array();
| >> > for(n=2;
| >> > n<args.length;
| >> > n+=2) { elm=FP_getObjectByID(args[n]); if(elm) {
| >> > doc.$imgSwaps[doc.$imgSwaps.length]=elm;
| >> > elm.$src=elm.src; elm.src=args[n+1]; } }
| >> > }
| >> >
| >> > function FP_preloadImgs() {//v1.0
| >> > var d=document,a=arguments; if(!d.FP_imgs) d.FP_imgs=new Array();
| >> > for(var i=0; i<a.length; i++) { d.FP_imgs=new Image;
| >> > d.FP_imgs.src=a; }
| >> > }
| >> >
| >> > function FP_getObjectByID(id,o) {//v1.0
| >> > var c,el,els,f,m,n; if(!o)o=document; if(o.getElementById)
| >> > el=o.getElementById(id);
| >> > else if(o.layers) c=o.layers; else if(o.all) el=o.all[id]; if(el)
| >> > return el;
| >> > if(o.id==id || o.name==id) return o; if(o.childNodes)
c=o.childNodes;
| >> > if(c)
| >> > for(n=0; n<c.length; n++) { el=FP_getObjectByID(id,c[n]); if(el)
| >> > return el; }
| >> > f=o.forms; if(f) for(n=0; n<f.length; n++) { els=f[n].elements;
| >> > for(m=0; m<els.length; m++){ el=FP_getObjectByID(id,els[n]);
if(el)
| >> > return
| >> > el; } }
| >> > return null;
| >> > }
| >> > // -->
| >> > </script>
| >> >
| >> >
| >> >
| >> > "Jens Peter Karlsen [FP MVP]" wrote:
| >> >
| >> > > It normal for the browser to render the page as it gets the
content.
| >> > > It
| >> > > doesn't wait until it has everything and then display the page.
| >> > >
| >> > > Regards Jens Peter Karlsen. Microsoft MVP - Frontpage.
| >> > >
| >> > > jsccorps wrote:
| >> > > > Has a flashing effect. Part of a page loads, quickly followed
by
| >> > > > the the
| >> > > > rest of the page. The pictures are not complex - most are text
| >> > > > only. Using
| >> > > > a Frontpage 2003 theme.
| >> > > >
| >> > > > See www.godoers.com
| >> > > >
| >> > > > Any ideas on how I can make the page loading smoother (and
easier
| >> > > > on the
| >> > > > eyes).
| >> > > >
| >> > >
|
|
 
For the state pressed (on/off) vs. the state hover
- same effect as hyperlink color for Alink

--




| Why is it necessary to add the onmousedown and onmouseup? Those are
| redundant events.
|
| --
| Murray
| ============
|
| | > FP Interactive Buttons only adds events for the 3 states
| > - default (restore), hover, & pressed as:
| > onmouseover, onmouseout, onmousedown, onmouseup
| >
| > Anything else on that page was added by the user as a behavior or
| > additional script
| >
| > --
| >
| > _____________________________________________
| > SBR @ ENJOY (-: [ Microsoft MVP - FrontPage ]
| > "Warning - Using the F1 Key will not break anything!" (-;
| > To find the best Newsgroup for FrontPage support see:
| > http://www.net-sites.com/sitebuilder/newsgroups.asp
| > _____________________________________________
| >
| >
| > | > | That page is about 5 times heavier than it should be -
| > |
| > | Global Statistics
| > | Total HTTP Requests: 32
| > | Total Size: 92909 bytes
| > |
| > | Object Size Totals
| > | Object type Size (bytes)
| > | HTML: 33314
| > | HTML Images: 59595
| > | CSS Images: 0
| > | Total Images: 59595
| > | Javascript: 0
| > | CSS: 0
| > | Multimedia: 0
| > | Other: 0
| > |
| > | External Objects
| > | External Object QTY
| > | Total HTML: 1
| > | Total HTML Images: 31
| > | Total CSS Images: 0
| > | Total Images: 31
| > | Total Scripts: 0
| > | Total CSS imports: 0
| > | Total Frames: 0
| > | Total Iframes: 0
| > |
| > |
| > | But, I don't see herky-jerky loading or any flickering like you are
| > | describing - can you tell me where to look?
| > |
| > | Or are you talking about the flickering as you mouse over the menu
| > options
| > | on the left? That's a combination of sloppy programming and weirdness
| > in
| > | FP. So you are sorta right.
| > |
| > | 1. Event handlers applied directly to <td> or <img> tags asks (begs,
| > even)
| > | for poor browser support - it's far better to just use an <a> tag
| > wrapping
| > | each image for the behaviors than to apply them directly into the image
| > tag.
| > | 2. It would be a simple matter to make the <a> tags display:block in
| > those
| > | table cells, thereby filling the cell completely - then you wouldn't see
| > the
| > | flickering at all.
| > | 3. I am not sure why FP adds all those additional event handlers to
| > these
| > | behaviors, e.g., onmousedown, onmouseup, ondblclick, etc. A simple
| > | onmouseover is adequate to trigger a fly out menu such as shown there,
| > with
| > | onmouseout to restore.
| > |
| > | --
| > | Murray
| > | ============
| > |
| > | | > | > I've just looked at several FrontPage-created sites, and guess what?
| > They
| > | > ALL
| > | > do the same thing: flash on page changes. And the JS is the same in
| > each.
| > | > The
| > | > others are not graphic intensive either.
| > | >
| > | > I think what we have here is a FP2003 Bug.
| > | > See http://www.ucss.com/software.htm. Does the same thing as my site.
| > Hmm.
| > | >
| > | > "Diana O" wrote:
| > | >
| > | >> I may have found the answer, posted on another board, from Jim Buyens
| > | >> Microsoft FrontPage MVP, http://www.interlacken.com. I am pretty sure
| > | >> this
| > | >> is it, but I will report back after checking my site for this. Read
| > on:
| > | >>
| > | >> QUOTE: This is probably because you're getting more onmouseout
| > | >> events than you expect.
| > | >>
| > | >> In DHTML, the mouse can only be "over" one element at a
| > | >> time. So, if you have a hyperlink inside a DIV, the mouse
| > | >> is over the DIV until you move it over the hyperlink.
| > | >>
| > | >> When the mouse is over the hyperlink, it's no longer over
| > | >> the DIV, so the DIV's onmouseout event fires and the DIV
| > | >> goes invisible.
| > | >>
| > | >> If you try to battle this by capturing onmouseovers on the
| > | >> hyperlink and making the DIV visible again, you get
| > | >> flicker as the DIV goes hidden and visible.
| > | >>
| > | >> Bottom line, capturing the onmouseout event isn't a good
| > | >> way to detect when the mouse passes outside the boundaries
| > | >> of the DIV. One alternative is to put the menu layer at z-
| > | >> order:2, and make another big layer that contains a
| > | >> transparent GIF picture at z-order:1. Then:
| > | >>
| > | >> o When you want to display the menu layer, display the
| > | >> transparent GIF layer as well.
| > | >> o When the transparent GIF layer gets onmouseover, hide
| > | >> both that layer and the menu layer.
| > | >>
| > | >> There are also various approaches for doing this with
| > | >> scripts. For example, you can capture onmousemove events
| > | >> and watch for the mouse coordinates to be outside the menu
| > | >> layer. But you can't do this using only the FrontPage GUI;
| > | >> you have to work in Code view.
| > | >>
| > | >> Jim Buyens
| > | >> Microsoft FrontPage MVP ENDQUOTE
| > | >>
| > | >>
| > | >>
| > | >> "Diana O" wrote:
| > | >>
| > | >> > I had the same problem (see my earlier post) AND we have something
| > in
| > | >> > common:
| > | >> > a Javascript in the page header that is for "preloading graphics."
| > It
| > | >> > looks
| > | >> > like something added by FrontPage.
| > | >> >
| > | >> > To you Microsoft MVPs (or a Javascript Guru!), would this script
| > cause
| > | >> > the
| > | >> > flashing that is happening??? I tend to think it is doing it, but I
| > | >> > can't
| > | >> > seem to remove it. Note that I had a rotating graphic in my header,
| > but
| > | >> > I've
| > | >> > removed it (site is natureschef.com).
| > | >> >
| > | >> > Thanks in advance for your comments!!
| > | >> >
| > | >> > Here's the script:
| > | >> > <script language="JavaScript">
| > | >> > <!--
| > | >> > function FP_swapImg() {//v1.0
| > | >> > var doc=document,args=arguments,elm,n; doc.$imgSwaps=new Array();
| > | >> > for(n=2;
| > | >> > n<args.length;
| > | >> > n+=2) { elm=FP_getObjectByID(args[n]); if(elm) {
| > | >> > doc.$imgSwaps[doc.$imgSwaps.length]=elm;
| > | >> > elm.$src=elm.src; elm.src=args[n+1]; } }
| > | >> > }
| > | >> >
| > | >> > function FP_preloadImgs() {//v1.0
| > | >> > var d=document,a=arguments; if(!d.FP_imgs) d.FP_imgs=new Array();
| > | >> > for(var i=0; i<a.length; i++) { d.FP_imgs=new Image;
| > | >> > d.FP_imgs.src=a; }
| > | >> > }
| > | >> >
| > | >> > function FP_getObjectByID(id,o) {//v1.0
| > | >> > var c,el,els,f,m,n; if(!o)o=document; if(o.getElementById)
| > | >> > el=o.getElementById(id);
| > | >> > else if(o.layers) c=o.layers; else if(o.all) el=o.all[id]; if(el)
| > | >> > return el;
| > | >> > if(o.id==id || o.name==id) return o; if(o.childNodes)
| > c=o.childNodes;
| > | >> > if(c)
| > | >> > for(n=0; n<c.length; n++) { el=FP_getObjectByID(id,c[n]); if(el)
| > | >> > return el; }
| > | >> > f=o.forms; if(f) for(n=0; n<f.length; n++) { els=f[n].elements;
| > | >> > for(m=0; m<els.length; m++){ el=FP_getObjectByID(id,els[n]);
| > if(el)
| > | >> > return
| > | >> > el; } }
| > | >> > return null;
| > | >> > }
| > | >> > // -->
| > | >> > </script>
| > | >> >
| > | >> >
| > | >> >
| > | >> > "Jens Peter Karlsen [FP MVP]" wrote:
| > | >> >
| > | >> > > It normal for the browser to render the page as it gets the
| > content.
| > | >> > > It
| > | >> > > doesn't wait until it has everything and then display the page.
| > | >> > >
| > | >> > > Regards Jens Peter Karlsen. Microsoft MVP - Frontpage.
| > | >> > >
| > | >> > > jsccorps wrote:
| > | >> > > > Has a flashing effect. Part of a page loads, quickly followed
| > by
| > | >> > > > the the
| > | >> > > > rest of the page. The pictures are not complex - most are text
| > | >> > > > only. Using
| > | >> > > > a Frontpage 2003 theme.
| > | >> > > >
| > | >> > > > See www.godoers.com
| > | >> > > >
| > | >> > > > Any ideas on how I can make the page loading smoother (and
| > easier
| > | >> > > > on the
| > | >> > > > eyes).
| > | >> > > >
| > | >> > >
| > |
| > |
| >
| >
|
|
 
They are unnecessary to get that effect.

--
Murray
============

Stefan B Rusynko said:
For the state pressed (on/off) vs. the state hover
- same effect as hyperlink color for Alink

--




| Why is it necessary to add the onmousedown and onmouseup? Those are
| redundant events.
|
| --
| Murray
| ============
|
| | > FP Interactive Buttons only adds events for the 3 states
| > - default (restore), hover, & pressed as:
| > onmouseover, onmouseout, onmousedown, onmouseup
| >
| > Anything else on that page was added by the user as a behavior or
| > additional script
| >
| > --
| >
| > _____________________________________________
| > SBR @ ENJOY (-: [ Microsoft MVP - FrontPage ]
| > "Warning - Using the F1 Key will not break anything!" (-;
| > To find the best Newsgroup for FrontPage support see:
| > http://www.net-sites.com/sitebuilder/newsgroups.asp
| > _____________________________________________
| >
| >
| > | > | That page is about 5 times heavier than it should be -
| > |
| > | Global Statistics
| > | Total HTTP Requests: 32
| > | Total Size: 92909 bytes
| > |
| > | Object Size Totals
| > | Object type Size (bytes)
| > | HTML: 33314
| > | HTML Images: 59595
| > | CSS Images: 0
| > | Total Images: 59595
| > | Javascript: 0
| > | CSS: 0
| > | Multimedia: 0
| > | Other: 0
| > |
| > | External Objects
| > | External Object QTY
| > | Total HTML: 1
| > | Total HTML Images: 31
| > | Total CSS Images: 0
| > | Total Images: 31
| > | Total Scripts: 0
| > | Total CSS imports: 0
| > | Total Frames: 0
| > | Total Iframes: 0
| > |
| > |
| > | But, I don't see herky-jerky loading or any flickering like you are
| > | describing - can you tell me where to look?
| > |
| > | Or are you talking about the flickering as you mouse over the menu
| > options
| > | on the left? That's a combination of sloppy programming and
weirdness
| > in
| > | FP. So you are sorta right.
| > |
| > | 1. Event handlers applied directly to <td> or <img> tags asks
(begs,
| > even)
| > | for poor browser support - it's far better to just use an <a> tag
| > wrapping
| > | each image for the behaviors than to apply them directly into the
image
| > tag.
| > | 2. It would be a simple matter to make the <a> tags display:block
in
| > those
| > | table cells, thereby filling the cell completely - then you wouldn't
see
| > the
| > | flickering at all.
| > | 3. I am not sure why FP adds all those additional event handlers to
| > these
| > | behaviors, e.g., onmousedown, onmouseup, ondblclick, etc. A simple
| > | onmouseover is adequate to trigger a fly out menu such as shown
there,
| > with
| > | onmouseout to restore.
| > |
| > | --
| > | Murray
| > | ============
| > |
| > | | > | > I've just looked at several FrontPage-created sites, and guess
what?
| > They
| > | > ALL
| > | > do the same thing: flash on page changes. And the JS is the same
in
| > each.
| > | > The
| > | > others are not graphic intensive either.
| > | >
| > | > I think what we have here is a FP2003 Bug.
| > | > See http://www.ucss.com/software.htm. Does the same thing as my
site.
| > Hmm.
| > | >
| > | > "Diana O" wrote:
| > | >
| > | >> I may have found the answer, posted on another board, from Jim
Buyens
| > | >> Microsoft FrontPage MVP, http://www.interlacken.com. I am pretty
sure
| > | >> this
| > | >> is it, but I will report back after checking my site for this.
Read
| > on:
| > | >>
| > | >> QUOTE: This is probably because you're getting more onmouseout
| > | >> events than you expect.
| > | >>
| > | >> In DHTML, the mouse can only be "over" one element at a
| > | >> time. So, if you have a hyperlink inside a DIV, the mouse
| > | >> is over the DIV until you move it over the hyperlink.
| > | >>
| > | >> When the mouse is over the hyperlink, it's no longer over
| > | >> the DIV, so the DIV's onmouseout event fires and the DIV
| > | >> goes invisible.
| > | >>
| > | >> If you try to battle this by capturing onmouseovers on the
| > | >> hyperlink and making the DIV visible again, you get
| > | >> flicker as the DIV goes hidden and visible.
| > | >>
| > | >> Bottom line, capturing the onmouseout event isn't a good
| > | >> way to detect when the mouse passes outside the boundaries
| > | >> of the DIV. One alternative is to put the menu layer at z-
| > | >> order:2, and make another big layer that contains a
| > | >> transparent GIF picture at z-order:1. Then:
| > | >>
| > | >> o When you want to display the menu layer, display the
| > | >> transparent GIF layer as well.
| > | >> o When the transparent GIF layer gets onmouseover, hide
| > | >> both that layer and the menu layer.
| > | >>
| > | >> There are also various approaches for doing this with
| > | >> scripts. For example, you can capture onmousemove events
| > | >> and watch for the mouse coordinates to be outside the menu
| > | >> layer. But you can't do this using only the FrontPage GUI;
| > | >> you have to work in Code view.
| > | >>
| > | >> Jim Buyens
| > | >> Microsoft FrontPage MVP ENDQUOTE
| > | >>
| > | >>
| > | >>
| > | >> "Diana O" wrote:
| > | >>
| > | >> > I had the same problem (see my earlier post) AND we have
something
| > in
| > | >> > common:
| > | >> > a Javascript in the page header that is for "preloading
graphics."
| > It
| > | >> > looks
| > | >> > like something added by FrontPage.
| > | >> >
| > | >> > To you Microsoft MVPs (or a Javascript Guru!), would this
script
| > cause
| > | >> > the
| > | >> > flashing that is happening??? I tend to think it is doing it,
but I
| > | >> > can't
| > | >> > seem to remove it. Note that I had a rotating graphic in my
header,
| > but
| > | >> > I've
| > | >> > removed it (site is natureschef.com).
| > | >> >
| > | >> > Thanks in advance for your comments!!
| > | >> >
| > | >> > Here's the script:
| > | >> > <script language="JavaScript">
| > | >> > <!--
| > | >> > function FP_swapImg() {//v1.0
| > | >> > var doc=document,args=arguments,elm,n; doc.$imgSwaps=new
Array();
| > | >> > for(n=2;
| > | >> > n<args.length;
| > | >> > n+=2) { elm=FP_getObjectByID(args[n]); if(elm) {
| > | >> > doc.$imgSwaps[doc.$imgSwaps.length]=elm;
| > | >> > elm.$src=elm.src; elm.src=args[n+1]; } }
| > | >> > }
| > | >> >
| > | >> > function FP_preloadImgs() {//v1.0
| > | >> > var d=document,a=arguments; if(!d.FP_imgs) d.FP_imgs=new
Array();
| > | >> > for(var i=0; i<a.length; i++) { d.FP_imgs=new Image;
| > | >> > d.FP_imgs.src=a; }
| > | >> > }
| > | >> >
| > | >> > function FP_getObjectByID(id,o) {//v1.0
| > | >> > var c,el,els,f,m,n; if(!o)o=document; if(o.getElementById)
| > | >> > el=o.getElementById(id);
| > | >> > else if(o.layers) c=o.layers; else if(o.all) el=o.all[id];
if(el)
| > | >> > return el;
| > | >> > if(o.id==id || o.name==id) return o; if(o.childNodes)
| > c=o.childNodes;
| > | >> > if(c)
| > | >> > for(n=0; n<c.length; n++) { el=FP_getObjectByID(id,c[n]);
if(el)
| > | >> > return el; }
| > | >> > f=o.forms; if(f) for(n=0; n<f.length; n++) {
els=f[n].elements;
| > | >> > for(m=0; m<els.length; m++){ el=FP_getObjectByID(id,els[n]);
| > if(el)
| > | >> > return
| > | >> > el; } }
| > | >> > return null;
| > | >> > }
| > | >> > // -->
| > | >> > </script>
| > | >> >
| > | >> >
| > | >> >
| > | >> > "Jens Peter Karlsen [FP MVP]" wrote:
| > | >> >
| > | >> > > It normal for the browser to render the page as it gets the
| > content.
| > | >> > > It
| > | >> > > doesn't wait until it has everything and then display the
page.
| > | >> > >
| > | >> > > Regards Jens Peter Karlsen. Microsoft MVP - Frontpage.
| > | >> > >
| > | >> > > jsccorps wrote:
| > | >> > > > Has a flashing effect. Part of a page loads, quickly
followed
| > by
| > | >> > > > the the
| > | >> > > > rest of the page. The pictures are not complex - most are
text
| > | >> > > > only. Using
| > | >> > > > a Frontpage 2003 theme.
| > | >> > > >
| > | >> > > > See www.godoers.com
| > | >> > > >
| > | >> > > > Any ideas on how I can make the page loading smoother (and
| > easier
| > | >> > > > on the
| > | >> > > > eyes).
| > | >> > > >
| > | >> > >
| > |
| > |
| >
| >
|
|
 
Disagree
- they are 2 different effects and can be applied separately w/ IB so they are paired in the code generated
(say you don't select the hover state in IB, and just select the pressed state - then there is no mouseover/out)

Agree the mouseout does visually does essentially the same as mouseup, but the event state is not the same

One event is mouseover / mouseout for hover (no clicking or mouse down/up arming action & onclick)

The second event is different for when you just barely mousedown & release w/o a click (or just before the onclick event occurs)
- you have to have a really quick and sensitive mouse for the onclick event to not fire and switch page on you
Arming is caused by a MouseDown over a link. When a link is armed it changes color to represent its new state. If onMouseUp returns
false, the default action is canceled. For example, if onMouseUp returns false over an armed link, the link is not triggered. Also,
if MouseUp occurs over an unarmed link (possibly due to onMouseDown returning false), the link is not triggered. A click event is a
combination of the MouseDown and MouseUp events
That means you can modify these 2 events to not fire an onclick event or use an IB w/o a hyperlink (which would then not trigger the
default onclick)

On my site you can see the red as that event state (pressed) vs hover
(but there are no special arming controls added there)
See http://sbrenjoy.bizland.com/

--




| They are unnecessary to get that effect.
|
| --
| Murray
| ============
|
| | > For the state pressed (on/off) vs. the state hover
| > - same effect as hyperlink color for Alink
| >
| > --
| >
| > _____________________________________________
| > SBR @ ENJOY (-: [ Microsoft MVP - FrontPage ]
| > "Warning - Using the F1 Key will not break anything!" (-;
| > To find the best Newsgroup for FrontPage support see:
| > http://www.net-sites.com/sitebuilder/newsgroups.asp
| > _____________________________________________
| >
| >
| > | > | Why is it necessary to add the onmousedown and onmouseup? Those are
| > | redundant events.
| > |
| > | --
| > | Murray
| > | ============
| > |
| > | | > | > FP Interactive Buttons only adds events for the 3 states
| > | > - default (restore), hover, & pressed as:
| > | > onmouseover, onmouseout, onmousedown, onmouseup
| > | >
| > | > Anything else on that page was added by the user as a behavior or
| > | > additional script
| > | >
| > | > --
| > | >
| > | > _____________________________________________
| > | > SBR @ ENJOY (-: [ Microsoft MVP - FrontPage ]
| > | > "Warning - Using the F1 Key will not break anything!" (-;
| > | > To find the best Newsgroup for FrontPage support see:
| > | > http://www.net-sites.com/sitebuilder/newsgroups.asp
| > | > _____________________________________________
| > | >
| > | >
| > | > | > | > | That page is about 5 times heavier than it should be -
| > | > |
| > | > | Global Statistics
| > | > | Total HTTP Requests: 32
| > | > | Total Size: 92909 bytes
| > | > |
| > | > | Object Size Totals
| > | > | Object type Size (bytes)
| > | > | HTML: 33314
| > | > | HTML Images: 59595
| > | > | CSS Images: 0
| > | > | Total Images: 59595
| > | > | Javascript: 0
| > | > | CSS: 0
| > | > | Multimedia: 0
| > | > | Other: 0
| > | > |
| > | > | External Objects
| > | > | External Object QTY
| > | > | Total HTML: 1
| > | > | Total HTML Images: 31
| > | > | Total CSS Images: 0
| > | > | Total Images: 31
| > | > | Total Scripts: 0
| > | > | Total CSS imports: 0
| > | > | Total Frames: 0
| > | > | Total Iframes: 0
| > | > |
| > | > |
| > | > | But, I don't see herky-jerky loading or any flickering like you are
| > | > | describing - can you tell me where to look?
| > | > |
| > | > | Or are you talking about the flickering as you mouse over the menu
| > | > options
| > | > | on the left? That's a combination of sloppy programming and
| > weirdness
| > | > in
| > | > | FP. So you are sorta right.
| > | > |
| > | > | 1. Event handlers applied directly to <td> or <img> tags asks
| > (begs,
| > | > even)
| > | > | for poor browser support - it's far better to just use an <a> tag
| > | > wrapping
| > | > | each image for the behaviors than to apply them directly into the
| > image
| > | > tag.
| > | > | 2. It would be a simple matter to make the <a> tags display:block
| > in
| > | > those
| > | > | table cells, thereby filling the cell completely - then you wouldn't
| > see
| > | > the
| > | > | flickering at all.
| > | > | 3. I am not sure why FP adds all those additional event handlers to
| > | > these
| > | > | behaviors, e.g., onmousedown, onmouseup, ondblclick, etc. A simple
| > | > | onmouseover is adequate to trigger a fly out menu such as shown
| > there,
| > | > with
| > | > | onmouseout to restore.
| > | > |
| > | > | --
| > | > | Murray
| > | > | ============
| > | > |
| > | > | | > | > | > I've just looked at several FrontPage-created sites, and guess
| > what?
| > | > They
| > | > | > ALL
| > | > | > do the same thing: flash on page changes. And the JS is the same
| > in
| > | > each.
| > | > | > The
| > | > | > others are not graphic intensive either.
| > | > | >
| > | > | > I think what we have here is a FP2003 Bug.
| > | > | > See http://www.ucss.com/software.htm. Does the same thing as my
| > site.
| > | > Hmm.
| > | > | >
| > | > | > "Diana O" wrote:
| > | > | >
| > | > | >> I may have found the answer, posted on another board, from Jim
| > Buyens
| > | > | >> Microsoft FrontPage MVP, http://www.interlacken.com. I am pretty
| > sure
| > | > | >> this
| > | > | >> is it, but I will report back after checking my site for this.
| > Read
| > | > on:
| > | > | >>
| > | > | >> QUOTE: This is probably because you're getting more onmouseout
| > | > | >> events than you expect.
| > | > | >>
| > | > | >> In DHTML, the mouse can only be "over" one element at a
| > | > | >> time. So, if you have a hyperlink inside a DIV, the mouse
| > | > | >> is over the DIV until you move it over the hyperlink.
| > | > | >>
| > | > | >> When the mouse is over the hyperlink, it's no longer over
| > | > | >> the DIV, so the DIV's onmouseout event fires and the DIV
| > | > | >> goes invisible.
| > | > | >>
| > | > | >> If you try to battle this by capturing onmouseovers on the
| > | > | >> hyperlink and making the DIV visible again, you get
| > | > | >> flicker as the DIV goes hidden and visible.
| > | > | >>
| > | > | >> Bottom line, capturing the onmouseout event isn't a good
| > | > | >> way to detect when the mouse passes outside the boundaries
| > | > | >> of the DIV. One alternative is to put the menu layer at z-
| > | > | >> order:2, and make another big layer that contains a
| > | > | >> transparent GIF picture at z-order:1. Then:
| > | > | >>
| > | > | >> o When you want to display the menu layer, display the
| > | > | >> transparent GIF layer as well.
| > | > | >> o When the transparent GIF layer gets onmouseover, hide
| > | > | >> both that layer and the menu layer.
| > | > | >>
| > | > | >> There are also various approaches for doing this with
| > | > | >> scripts. For example, you can capture onmousemove events
| > | > | >> and watch for the mouse coordinates to be outside the menu
| > | > | >> layer. But you can't do this using only the FrontPage GUI;
| > | > | >> you have to work in Code view.
| > | > | >>
| > | > | >> Jim Buyens
| > | > | >> Microsoft FrontPage MVP ENDQUOTE
| > | > | >>
| > | > | >>
| > | > | >>
| > | > | >> "Diana O" wrote:
| > | > | >>
| > | > | >> > I had the same problem (see my earlier post) AND we have
| > something
| > | > in
| > | > | >> > common:
| > | > | >> > a Javascript in the page header that is for "preloading
| > graphics."
| > | > It
| > | > | >> > looks
| > | > | >> > like something added by FrontPage.
| > | > | >> >
| > | > | >> > To you Microsoft MVPs (or a Javascript Guru!), would this
| > script
| > | > cause
| > | > | >> > the
| > | > | >> > flashing that is happening??? I tend to think it is doing it,
| > but I
| > | > | >> > can't
| > | > | >> > seem to remove it. Note that I had a rotating graphic in my
| > header,
| > | > but
| > | > | >> > I've
| > | > | >> > removed it (site is natureschef.com).
| > | > | >> >
| > | > | >> > Thanks in advance for your comments!!
| > | > | >> >
| > | > | >> > Here's the script:
| > | > | >> > <script language="JavaScript">
| > | > | >> > <!--
| > | > | >> > function FP_swapImg() {//v1.0
| > | > | >> > var doc=document,args=arguments,elm,n; doc.$imgSwaps=new
| > Array();
| > | > | >> > for(n=2;
| > | > | >> > n<args.length;
| > | > | >> > n+=2) { elm=FP_getObjectByID(args[n]); if(elm) {
| > | > | >> > doc.$imgSwaps[doc.$imgSwaps.length]=elm;
| > | > | >> > elm.$src=elm.src; elm.src=args[n+1]; } }
| > | > | >> > }
| > | > | >> >
| > | > | >> > function FP_preloadImgs() {//v1.0
| > | > | >> > var d=document,a=arguments; if(!d.FP_imgs) d.FP_imgs=new
| > Array();
| > | > | >> > for(var i=0; i<a.length; i++) { d.FP_imgs=new Image;
| > | > | >> > d.FP_imgs.src=a; }
| > | > | >> > }
| > | > | >> >
| > | > | >> > function FP_getObjectByID(id,o) {//v1.0
| > | > | >> > var c,el,els,f,m,n; if(!o)o=document; if(o.getElementById)
| > | > | >> > el=o.getElementById(id);
| > | > | >> > else if(o.layers) c=o.layers; else if(o.all) el=o.all[id];
| > if(el)
| > | > | >> > return el;
| > | > | >> > if(o.id==id || o.name==id) return o; if(o.childNodes)
| > | > c=o.childNodes;
| > | > | >> > if(c)
| > | > | >> > for(n=0; n<c.length; n++) { el=FP_getObjectByID(id,c[n]);
| > if(el)
| > | > | >> > return el; }
| > | > | >> > f=o.forms; if(f) for(n=0; n<f.length; n++) {
| > els=f[n].elements;
| > | > | >> > for(m=0; m<els.length; m++){ el=FP_getObjectByID(id,els[n]);
| > | > if(el)
| > | > | >> > return
| > | > | >> > el; } }
| > | > | >> > return null;
| > | > | >> > }
| > | > | >> > // -->
| > | > | >> > </script>
| > | > | >> >
| > | > | >> >
| > | > | >> >
| > | > | >> > "Jens Peter Karlsen [FP MVP]" wrote:
| > | > | >> >
| > | > | >> > > It normal for the browser to render the page as it gets the
| > | > content.
| > | > | >> > > It
| > | > | >> > > doesn't wait until it has everything and then display the
| > page.
| > | > | >> > >
| > | > | >> > > Regards Jens Peter Karlsen. Microsoft MVP - Frontpage.
| > | > | >> > >
| > | > | >> > > jsccorps wrote:
| > | > | >> > > > Has a flashing effect. Part of a page loads, quickly
| > followed
| > | > by
| > | > | >> > > > the the
| > | > | >> > > > rest of the page. The pictures are not complex - most are
| > text
| > | > | >> > > > only. Using
| > | > | >> > > > a Frontpage 2003 theme.
| > | > | >> > > >
| > | > | >> > > > See www.godoers.com
| > | > | >> > > >
| > | > | >> > > > Any ideas on how I can make the page loading smoother (and
| > | > easier
| > | > | >> > > > on the
| > | > | >> > > > eyes).
| > | > | >> > > >
| > | > | >> > >
| > | > |
| > | > |
| > | >
| > | >
| > |
| > |
| >
| >
|
|
 
Back
Top