Joomla Templates Club 406,261 posts

[Omar Ramos JAEC Omar RamosJoin date: September 2014Posts: 93Downloads:154Uploads:12 Thanked: 15 times in 1 posts]

#144517

I’ve noticed this since the Teline II days but it seems like the Dropline menu always needs to wait for the entire page to load before the second layer of navigation can be seen…it would be a lot better if this could be reworked (as I’m pretty sure it could) so that as soon as the list is available the second+ layers of the dropline could be too.

That would improve responsiveness considerably when using the dropline menu.

[mihirc Friend mihircJoin date: December 2008Posts: 597Downloads:0Uploads:3 Thanks: 62 Thanked: 95 times in 39 posts]

#318253

Hello,

I think, if my web based knowledge is correct that the javascripts are the last to run when a browser parses a webpage. Its always like HTML & images, php & then javascripts.

So it will load at the last end. This would be seen in all javascript related programmes.

Please correct me if I am wrong.

Regards,
Mihir Chhatre.

[Omar Ramos JAEC Omar RamosJoin date: September 2014Posts: 93Downloads:154Uploads:12 Thanked: 15 times in 1 posts]

#318266

Mootools and other JavaScript frameworks have a custom “domready” event that gets executed when all of the HTML on the page is ready, but before the images on your page have loaded completely so technically the dropline menu should be using that if it isn’t already, and from it’s current behavior it doesn’t seem like Joomlart’s implementation is using domready…from the last line in the dropline.js file:

jaAddEvent(window, 'load', jasdl_initJAScriptDLMenu)

It looks like it is using ‘onload’, which suffers from the drawback of having to wait for all images on the page to load.

Taking a look at that method in Joomlart’s code indicates that it definitely is not using any Mootools domready goodness:


//addEvent - attach a function to an event
function jaAddEvent(obj, evType, fn){
if (obj.addEventListener){
obj.addEventListener(evType, fn, false);
return true;
} else if (obj.attachEvent){
var r = obj.attachEvent("on"+evType, fn);
return r;
} else {
return false;
}
}

[cgc0202 Friend cgc0202Join date: August 2007Posts: 2244Downloads:0Uploads:3 Thanks: 206 Thanked: 262 times in 1 posts]

#318277

<em>@omarram 145855 wrote:</em><blockquote>I’ve noticed this since the Teline II days but it seems like the Dropline menu always needs to wait for the entire page to load before the second layer of navigation can be seen…it would be a lot better if this could be reworked (as I’m pretty sure it could) so that as soon as the list is available the second+ layers of the dropline could be too.

That would improve responsiveness considerably when using the dropline menu.</blockquote>

Thanks for pointing this out again, Omarram. I pointed this out in a separate thread because it also creates the “jerky appearance” of the site, when the dropline submenu finally appears.

This “jerky appearance” problem is even more evident in all the Tab modules. They are the slowest loading components of the Teline II and Teline III site. But, even these are loaded first even before the dropline submenu finally appears.

Using the same (old) computer and browser, my partially optimized Teline II site loads between 5-15 seconds (depending on the time of the day) while the “default” Teline III took at least a minute or more. A partly optimized (some features were placed in inner pages) Teline II Demo site, at best took 30 seconds or so.

Many users of the Teline II cited this issue of slow load presentation early on. One reason why some opted not to use Teline II. What I noriced also was that at the time:

Joomla 1.0.x-Teline II was very much faster than Joomla 1.5.x-Teline II

It appeared that this might be due partly to increasing modularization of the features, For example, the “footer” was a simple two line script in the index.php in Joomla 1.0.x but became a complex script requiring access to numerous files and nested directories in Joomla 1.5.x. I do not know much about scripting really, but what was done was akin to the inclusion of quite a few “include” statements to gather all the information to create what is essentially a two-line content in the footer.

But, that is only part of the issue. As you pointed out, it is common practice in many well-scripted sites I have been accessing for the text content to appear first, and later on for the more slow loading images to be presented in the page. This is achieved partly on how the presentation is scripted (see quote below).

Do you have any suggestion on how to revise some of the scriptss that we could try?

Also, I noticed that in the template.css, a number of the CSS specifications that define the skeletal framework of the homepage are placed at the bottom. Does this make a lot of difference? In Teline II, I actually created a partially integrated CSS file that included most of the CSS specification that were used in the Homepage.

Thanks for sharing your thoughts on this.

Cornelio

<em>@omarram 145875 wrote:</em><blockquote>Mootools and other JavaScript frameworks have a custom “domready” event that gets executed when all of the HTML on the page is ready, but before the images on your page have loaded completely so technically the dropline menu should be using that if it isn’t already, and from it’s current behavior it doesn’t seem like Joomlart’s implementation is using domready…from the last line in the dropline.js file:

jaAddEvent(window, 'load', jasdl_initJAScriptDLMenu)

It looks like it is using ‘onload’, which suffers from the drawback of having to wait for all images on the page to load.

Taking a look at that method in Joomlart’s code indicates that it definitely is not using any Mootools domready goodness:


//addEvent - attach a function to an event
function jaAddEvent(obj, evType, fn){
if (obj.addEventListener){
obj.addEventListener(evType, fn, false);
return true;
} else if (obj.attachEvent){
var r = obj.attachEvent("on"+evType, fn);
return r;
} else {
return false;
}
}
</blockquote>

[gabrielanta Friend gabrielantaJoin date: January 2009Posts: 52Downloads:0Uploads:11 Thanks: 18 Thanked: 4 times in 1 posts]

#318816

What happend to me is that the second layer of navigation menu is HIDDEN when the index is loaded. Every time the mouse moves over the menu, then the second layer is shown, but that makes the entire content TO MOVE DOWN, and when the mouse get out of the “menu area”, then the content MOVE UP AGAIN… That looks ugly.

Do you know how can I FORCE the second layer to be allways VISIBLE?

Thank you very much,
Gabriel

[martincg Friend martincgJoin date: January 2007Posts: 16Downloads:0Uploads:0 Thanks: 7]

#347163

<em>@gabrielanta 146568 wrote:</em><blockquote>What happend to me is that the second layer of navigation menu is HIDDEN when the index is loaded. Every time the mouse moves over the menu, then the second layer is shown, but that makes the entire content TO MOVE DOWN, and when the mouse get out of the “menu area”, then the content MOVE UP AGAIN… That looks ugly.

Do you know how can I FORCE the second layer to be allways VISIBLE?

Thank you very much,
Gabriel</blockquote>

yep, lots of users want this – is somewhere modification for always visible second line of menu /if the page is not linked to main menu item/ ?

[ajbpalma77 Friend ajbpalma77Join date: October 2010Posts: 10Downloads:0Uploads:1 Thanks: 3 Thanked: 2 times in 2 posts]

#358496

Solution:

At the end of the file dropline.js replace:

window.addEvent ('load', jasdl_initJAScriptDLMenu);

to:

window.addEvent ('domready', jasdl_initJAScriptDLMenu);

Problem Solved 😎

[Author]

Posts