Crossbrowser SmartNavigation Alternative II

Download source files- 4.64 Kb

Introduction

In my previous article, I have introduced Crossbrowser SmartNavigation Alternative. However, this doesn't support link buttons, because the link buttons either does not submit the form or does not fire an event. Instead of getting the scroll positions in the onsubmit event, getting them in the onscroll event is better. But other browsers badly supports the onscroll event. This event is fired when mouse moves the scroll in other browsers. So I get the scroll positions using onscroll, onkeypress and onclick events in other browsers.

I have tested this on Internet Explorer 6.0, FireFox 1.0 and Netcape 7.2.

Adding this control to your page

Insert this code to the head of your page.

<%@ Register TagPrefix="cc1" Namespace="Uludag" Assembly="lili2" %>

And insert this code into your form.

<cc1:Lili2 id="Lili1" runat="server"/>

Or, you can follow the instructions in my previous article.

I hope this helps somebody out there, I would be interested in receiving any comments.

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here

About the Author

ibrahimuludag

Web Developer

Turkey

Member

Ibrahim ULUDAG
Software Developer
ibrahimuludag@gmail.com
http://ibrahimuludag.blogspot.com/
http://www.ibrahimuludag.com/

Article Top

Poor

Excellent

Add a reason or comment to your vote: x
Votes of 3 or less require a comment

Comments and Discussions

You must Sign In to use this message board. (secure sign-in)

Search this forum
	Profile popups Noise Layout Per page

Thanks for sharing this.

Thanh H. Pham

12:41 10 May '09

I'm using ASP.NET 1.1 to develop my customer's site. They don't want to upgrade to 2.0 so your idea is really good. Thanks.
Sign In·View Thread·Permalink

IMPORTANT: Fix for Firefox, IE7, etc. when using doctype

CabbageMonster

9:25 26 Mar '09

In these browsers, scrollTop is no longer located in document.body, but in document.documentElement. It will not work unless Lili2.cs is modified.

In Lili2.cs, locate:

writer.Write("document.getElementById(\"" + this.ID  + "_OffsetY\").value = document.body.scrollTop;\n");
writer.Write("document.getElementById(\"" + this.ID  + "_OffsetX\").value = document.body.scrollLeft;\n");

and replace it with:

writer.Write("if (document.documentElement.scrollTop || document.documentElement.scrollLeft) {");
writer.Write("document.getElementById(\"" + this.ID  + "_OffsetY\").value = document.documentElement.scrollTop;\n");
writer.Write("document.getElementById(\"" + this.ID  + "_OffsetX\").value = document.documentElement.scrollLeft;\n");
writer.Write("} else {");
writer.Write("document.getElementById(\"" + this.ID  + "_OffsetY\").value = document.body.scrollTop;\n");
writer.Write("document.getElementById(\"" + this.ID  + "_OffsetX\").value = document.body.scrollLeft;\n");
writer.Write("}");

After a recompile, this fixed mine

Thanks for the great share.

mcrabben7

12:08 19 Apr '07

Using this for a project involving ASP.NET in VB. Works great with DropDownList boxes, inside DIV tags, etc. Also a hint for some people who hate page flashing. Try this metatag. I found an article with this semi-solution on the web. `<meta http-equiv="Page-Exit" Context="blendTrans(Duration=0.01)">` Lili2 with that metatag improves the usability of the page 200% in my opinion. Thanks again.
Sign In·View Thread·Permalink

Doesn't works under IE7.

marcin.rawicki

4:46 12 Mar '07

Any ideas, why it doesn't works under IE7 (under IE6x it works fine)
Sign In·View Thread·Permalink

Doesn't Work under XHTML DOCTYPE

gtownsend2007

11:46 15 Jan '07

I have not been able to get it to work under the following doctypes i take them out it works wonderfully put them in and it stops working i get no errors or warnings of any sorts. Just doesn't work

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

XHTML 1.1 DTD
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

Different Use

BobsAfro

22:39 14 Jan '07

I am trying to create a link on a page back to the previous page. But I would like to return the user to the scroll position on that page. I can't use javascript:history.back() because they may have performed a postback in which case it will not take them to the previous page. Could this control be modified or used in the way I have said?
Sign In·View Thread·Permalink

Thank you

Farhan Noor Qureshi

12:12 16 Oct '06

Hi Ibrahim, Thank you for sharing Lili1 and Lili2. I am using Lili2 and I am quite happy to state that it works beautifully. I tested it in IE6 with SP1 and FireFox 1.5.0.7, both on Windows XP SP2. Cheers. Farhan Noor Qureshi
Sign In·View Thread·Permalink

Works perfectly, thanks a million!

zangad

6:05 19 Jul '06

The control you wrote works perfectly with my .NET app. I'm using a datagrid with edit/update/delete buttons and your control preserves the scroll position just like SmartNavigation does, but with the added bonus of working with our custom JavaScript libraries! Thank you!!!
Sign In·View Thread·Permalink

Link for Lili3 not working?

Mads Christensen

3:54 29 Jun '06

İbrahim Really nice work with the control! I can't d/l lili3 - dunno why. I need the enabled functionality.
Sign In·View Thread·Permalink

THANKS

tavo_

6:28 14 May '06

Nice Work !!! Gustavo
Sign In·View Thread·Permalink

Lili3 Enabled

raoulguenette

11:41 1 Feb '06

Hi I'm using Lili3 with the Enabled property. It seems that once you disable it in a PostBack, it can't be enable anymore (Enabled = true had no effect). Thanks
Sign In·View Thread·Permalink

Re: Lili3 Enabled

ibrahimuludag

12:01 28 Apr '06

enabled property is not saved in the viewstate . You must save it in the viewstate like Private Property Enabled as boolean set(byval value as boolean) Viewstate("enabled") = value end set get return Viewstate("enabled") end get end property Ibrahim ULUDAG Software Developer ibrahimuludag@gmail.com www.ibrahimuludag.com
Sign In·View Thread·Permalink

Doesn't work with auto refresh

Baelzharon

6:01 25 Jan '06

I have smart navigation turned off and added your control to my page, but when using the meta tag refresh "meta http-equiv=refresh content=300" the auto refresh triggers and the page scrolls to the top. Anyway to get around this problem? I noticed the same thing happened when using the .net smart navigation.
Sign In·View Thread·Permalink

Re: Doesn't work with auto refresh

ibrahimuludag

12:03 28 Apr '06

Because refresh does not post the page. That's why it does not work. You can make change by using cookies. Ibrahim ULUDAG Software Developer ibrahimuludag@gmail.com www.ibrahimuludag.com
Sign In·View Thread·Permalink

Excelente

AlejoFC

5:06 25 Jan '06

El control funciona muy bien, muchas gracias. Medellin - Colombia
Sign In·View Thread·Permalink

firefox support

frankkkkk

5:54 4 Oct '05

Hi mate, good lump of code. Works in safari on a mac, btw. Only thing is, I can't get it to work in firefox on a pc. I'm using v1.06 of firefox. any thoughts are welcome. cheers, Frank
Sign In·View Thread·Permalink

Re: firefox support [modified]

CabbageMonster

7:40 26 Mar '09

In Lili2.cs, locate:

writer.Write("document.getElementById(\"" + this.ID  + "_OffsetY\").value = document.body.scrollTop;\n");
writer.Write("document.getElementById(\"" + this.ID  + "_OffsetX\").value = document.body.scrollLeft;\n");

and replace it with:

writer.Write("if (document.documentElement.scrollTop || document.documentElement.scrollLeft) {");
writer.Write("document.getElementById(\"" + this.ID  + "_OffsetY\").value = document.documentElement.scrollTop;\n");
writer.Write("document.getElementById(\"" + this.ID  + "_OffsetX\").value = document.documentElement.scrollLeft;\n");
writer.Write("} else {");
writer.Write("document.getElementById(\"" + this.ID  + "_OffsetY\").value = document.body.scrollTop;\n");
writer.Write("document.getElementById(\"" + this.ID  + "_OffsetX\").value = document.body.scrollLeft;\n");
writer.Write("}");

After a recompile, this fixed mine in Firefox and IE7

modified on Thursday, March 26, 2009 1:47 PM

modified on Thursday, March 26, 2009 3:21 PM

Disable for pagers?

Donzella

6:45 6 Sep '05

I have a datagrid on a page where I am using lili2. lili2 works great but I want to be able to tell it NOT to scroll if a "pager" was clicked sending a postback. It is causing the next page in the grid results to scroll down to the bottom when I don't want that. Suggestions? Thanks.
Sign In·View Thread·Permalink

Re: Disable for pagers?

ibrahimuludag

7:38 6 Sep '05

You can try this control. The used is the same. Just set the enabled property. http://www.ibrahimuludag.com/external/lili3.zip Ibrahim ULUDAG Software Developer ibrahimuludag@gmail.com www.ibrahimuludag.com
Sign In·View Thread·Permalink

Re: Disable for pagers?

Donzella

8:03 6 Sep '05

If I still want lili to work on the page but just not for the pagers, is this still what I need? Can I mark it disabled only if the pager is clicked and have it still work correctly when the pager is not clicked?
Sign In·View Thread·Permalink

Re: Disable for pagers?

Anonymous

12:11 6 Sep '05

This is the same control. Only the enabled feature (which you want) is added. In the paging function add MyLili.enabled = false. Then it will be disabled. The enabled property is not stored in the viewstate. So you should set enabled = false when you need. You need not to set enabled = true.
Sign In·View Thread·Permalink

Re: Disable for pagers?

Donzella

12:21 6 Sep '05

I have not made myself clear, I'm sorry. I do not want to disable the control for the page. I actually use it on the page. On this page I have a datagrid that is paged. There are pager buttons at the bottom of the page to move to other pages within the paged list. When those pager buttons are clicked I do not want lili to scroll the page when it displays the next page. But there are functions on that same page that post back to the current page with processing and I want lili to scroll at that time. So I only want to disable lili if the pagers are clicked but I want it to work for all other postbacks. Is that making sense?

Thanks.

doesnt work with doctype

DroneX5

4:01 27 Jul '05

the control doesn't seem to be working when i use a doctype am i doing something wrong here or is it normal that it doesn't work with doctype. greetings the friendly stranger
Sign In·View Thread·Permalink

Re: doesnt work with doctype

GreekShowPony

5:36 29 May '06

I just read this and tried my code without a doctype and it worked. However I really need the doctype. Is there any fix to this?
Sign In·View Thread·Permalink

Re: doesnt work with doctype

CabbageMonster

9:23 26 Mar '09

In Lili2.cs, locate:

writer.Write("document.getElementById(\"" + this.ID  + "_OffsetY\").value = document.body.scrollTop;\n");
writer.Write("document.getElementById(\"" + this.ID  + "_OffsetX\").value = document.body.scrollLeft;\n");

and replace it with:

writer.Write("if (document.documentElement.scrollTop || document.documentElement.scrollLeft) {");
writer.Write("document.getElementById(\"" + this.ID  + "_OffsetY\").value = document.documentElement.scrollTop;\n");
writer.Write("document.getElementById(\"" + this.ID  + "_OffsetX\").value = document.documentElement.scrollLeft;\n");
writer.Write("} else {");
writer.Write("document.getElementById(\"" + this.ID  + "_OffsetY\").value = document.body.scrollTop;\n");
writer.Write("document.getElementById(\"" + this.ID  + "_OffsetX\").value = document.body.scrollLeft;\n");
writer.Write("}");