472,807 Members | 1,749 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 472,807 software developers and data experts.

Mobile IE changing display properties in CSS

Hi,

is there a way to change the display property on Windows Mobile 2003 SE
Mobile/Pocket Internet Explorer? See following example.

Please note: visibilty property has the same problem.

Is there any other way to display/undisplay parts of web pages?

TIA

Stefan

<HTML><HEAD><TITLE>Test Display</TITLE></HEAD><BODY>

<P onclick="document.all.data.style.display=
(document.all.data.style.display=='none') ? '' : 'none'">
Click here to display more or less data:</P>

<P id=data style="display:none">More data.</P>

</BODY></HTML>

Oct 7 '05 #1
7 5975
Stefan Finzel wrote:
Hi,

is there a way to change the display property on Windows Mobile 2003 SE
Mobile/Pocket Internet Explorer? See following example.

Please note: visibilty property has the same problem.

Is there any other way to display/undisplay parts of web pages?

TIA

Stefan

<HTML><HEAD><TITLE>Test Display</TITLE></HEAD><BODY>

<P onclick="document.all.data.style.display=
(document.all.data.style.display=='none') ? '' : 'none'">
Click here to display more or less data:</P>

<P id=data style="display:none">More data.</P>

</BODY></HTML>


Dunno, try the following:
<script type="text/javascript">

function showHide(id)
{
if(document.getElementById) {
var el = document.getElementById(id);
}
if (el && el.style){
el.style.display = ('none' == el.style.display)? '' : 'none';
}
}

</script>

<p onclick="showHide('data');">
Click here to display more or less data:</p>

<p id="data">More data.</p>

--
Rob
Oct 8 '05 #2
Stefan Finzel said the following on 10/7/2005 2:29 PM:
Hi,

is there a way to change the display property on Windows Mobile 2003 SE
Mobile/Pocket Internet Explorer? See following example.

Please note: visibilty property has the same problem.

Is there any other way to display/undisplay parts of web pages?

TIA

Stefan

<HTML><HEAD><TITLE>Test Display</TITLE></HEAD><BODY>

<P onclick="document.all.data.style.display=
(document.all.data.style.display=='none') ? '' : 'none'">
Click here to display more or less data:</P>

<P id=data style="display:none">More data.</P>

</BODY></HTML>


Several thoughts:

Try alerting document.all.data.style.display to see what it contains.
Try it without the ternary ?: operator to see if maybe it doesn't
support it (It should throw an error if it doesnt, but, who knows).
Try the gEBI approach that Rob posted about.
Try alerting document.all.data.style.display after you have attempted to
change it to see what it contains.

The last one will tell you if it doesn't support changing it, or, that
it supports it but won't change the display (a bug).

--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Oct 8 '05 #3
Well, it's really sad. getElementById is not supported by Pocket IE.
I've read it'll be there with Microsoft Windows Mobile 5.0. But all our
devices are using Windows Mobile 3.0 and even may not be upgradable.

Changing Robs code I've found another annoying difference. onclick is
not executed on <P>. It looks like <a>, <form> or a form element
<input>,.. is required to get an onclick event.

The most annoying part is the acceptance of the display style attribute
at loading time. Setting it in the html source to none will hide the
element(s). Not using or setting it to something else will display the
element(s) as expected. It looks like there is a switch anywhere else.
Any idea? Sorry the following example code now gets large.

TIA

Stefan
<script type="text/javascript">
function ev_toggle_display(name) {
el = ev_getElementByName(name);
// looking at element
// alert (el);
// returns: [object]
// alert (el.style);
// returns nothing (=undefined?)
// alert (el.style.display);
// returns Microsoft JScript runtime error
// line: # character: #
// Error 'el.style.display' is null or not an object
// Source: (null)

// looking at document
// alert (document);
// returns: [object]
// alert (document.all);
// returns nothing (=undefined?)
// alert (document.all.data);
// returns Microsoft JScript runtime error
// line: # character: #
// Error 'document.all.data' is null or not an object
// Source: (null)

// alert (document.forms);
// returns: [object]
//alert (document.forms[0].data);
// returns: [object]
// alert (document.forms[0].data.style);
// returns nothing (=undefined?)
if (el.style.display == 'none') {
el.style.display = '';
} else {
el.style.display = 'none'
}
}

function ev_getElementByName(elName) {
// all elements ID and NAME are kept the same and unique
var el = null;
if (document.getElementById) {
el = document.getElementById(elName);
} else {
// Pocket IE: getElementById is not available
// Walk through all forms and elements
for (var j=0; j<document.forms.length; j++) {
if (document.forms[j].name == elName) {
el = document.forms[j];
break;
}
for (var i=0;i<document.forms[j].elements.length;i++) {
if (document.forms[j].elements[i].name == elName) {
el = document.forms[j].elements[i];
break;
}
}
}
}
return el;
}
</script>
<FORM ACTION="#">
<INPUT ONCLICK="javascript:ev_toggle_display('data');retu rn false;"
TYPE="SUBMIT" VALUE="Click here to display more or less data">
<INPUT ID="data" NAME="data" STYLE="display:none;" TYPE="TEXT"
VALUE="More data.">
</FORM>

As before. The code is working on IE5+/6, NS, Moz, FF, Galeon, Konqueror.
RobG wrote:
<script type="text/javascript">

function showHide(id)
{
if(document.getElementById) {
var el = document.getElementById(id);
}
if (el && el.style){
el.style.display = ('none' == el.style.display)? '' : 'none';
}
}

</script>

<p onclick="showHide('data');">
Click here to display more or less data:</p>

<p id="data">More data.</p>

Oct 8 '05 #4
Stefan Finzel wrote:
Well, it's really sad. getElementById is not supported by Pocket IE.
I've read it'll be there with Microsoft Windows Mobile 5.0. But all our
devices are using Windows Mobile 3.0 and even may not be upgradable.

Changing Robs code I've found another annoying difference. onclick is
not executed on <P>. It looks like <a>, <form> or a form element
<input>,.. is required to get an onclick event.

The most annoying part is the acceptance of the display style attribute
at loading time. Setting it in the html source to none will hide the
element(s). Not using or setting it to something else will display the
element(s) as expected. It looks like there is a switch anywhere else.
Any idea? Sorry the following example code now gets large.
Yeah, sad.

You could try changing the class from one with - display: none; - to one
with - display: ; - but I don't like your chances.

It might be best to forget the whole hide/show thing for the time being,
or implement it with graceful failure and wait for 5.0 - don't hide
anything in the HTML source, use script when the page loads. That way
anything that can't be revealed with script shouldn't be hidden in the
first place.

Seems PDAs need this type of functionality the most, yet it's not supported.


TIA

Stefan
<script type="text/javascript">
function ev_toggle_display(name) {
el = ev_getElementByName(name);
// looking at element
// alert (el);
// returns: [object]
// alert (el.style);
// returns nothing (=undefined?)
Yes, if supported it should return [object].

[...] // looking at document
// alert (document);
// returns: [object]
// alert (document.all);
// returns nothing (=undefined?)
Yes, if document.all is supported it should return [object] - it is
effectively a collection of every element in the document.
// alert (document.all.data);
// returns Microsoft JScript runtime error
// line: # character: #
// Error 'document.all.data' is null or not an object
// Source: (null)

// alert (document.forms);
// returns: [object]
//alert (document.forms[0].data);
// returns: [object]
// alert (document.forms[0].data.style);
// returns nothing (=undefined?)
Again, if supported it will return 'object'. If the style object isn't
supported elsewhere, it's ulikely to be supported here.
if (el.style.display == 'none') {
el.style.display = '';
} else {
el.style.display = 'none'
}
}

function ev_getElementByName(elName) {
// all elements ID and NAME are kept the same and unique
var el = null;
if (document.getElementById) {
el = document.getElementById(elName);
} else {
// Pocket IE: getElementById is not available
// Walk through all forms and elements
for (var j=0; j<document.forms.length; j++) {
if (document.forms[j].name == elName) {
el = document.forms[j];
break;


That's amazing, have you tried:

el = document.forms[elName];
[...]

--
Rob
Oct 9 '05 #5
Hi Rob,

RobG wrote:
....
You could try changing the class from one with - display: none; - to one
with - display: ; - but I don't like your chances. ....

A good point! I only tried to modify a class so far and failed.
Switching the class completly is much better.

But neither element.style nor document.styleSheets exists.

.... It might be best to forget the whole hide/show thing for the time being,
or implement it with graceful failure and wait for 5.0 - don't hide
anything in the HTML source, use script when the page loads. That way
anything that can't be revealed with script shouldn't be hidden in the
first place.

Seems PDAs need this type of functionality the most, yet it's not
supported. ....

Yes, it's really sad. I started javascript only to help small screen
users and give them some additional accessibility features: larger
fonts, avoid narrow native keypads by using spezialized character
selections which are displayed by larger buttons/links, validation at
input ...

The display/undisplay ougth to be used while opening keypads like a
calendar by a small button/link. The button is not available at all if
the keypads are not runable - no graceful failure, no javascript console
error and never no failure at all as long as it can be avoided. I
activated showing javascript errors on the PDA and its a pain being
bombed with alerts while visiting some web sites.

The worst point, displaying all of these keypads on a page is no
alternative. There may be several of them and most of them may be only
rarely used. The applications is designed for small screens. Not hiding
the keypads will corrupt the simple page design and force users to
scroll, turning round the benefit of the keypads usage.

Reloading a modified version of a page each time would be another way.
But the application gets very slow through bandwidth, processor
limitations (520 MHz) and maybe https. Although all pages are small and
completly simple and tidy html sources the PDA requires up to three
seconds (my old PC for tests has 166MHz, 64MB RAM and never needed more
than half a second). Reloading hits the workflow and surely the
acceptance of the pages. A bored manager waiting at the airport may
accept this but no technician at his workplace.

Opening another window pulls users out of the local context. It is not
feasible too, as window.open/moveTo/resizeto is not supported by Pocket IE.

Rob, you are totaly right. It seems we have to wait for Windows Mobile
5.0 and a hopefully better implementation of its Mobile IE.

.... That's amazing, have you tried:

el = document.forms[elName];


Yes, I tried it. Pocket IE does not support it.
A private conclusion at the end:

Using javascript for porting existing cross platform Web applications to
Mobile Web applications seems to be my major design decision failure in
the moment (Oct. 2005). It's mainly limited environment, its
requirements and implementation gaps causing problems. Writing
standalone applications maybe a better way while waiting for WM5 break
through.

A couple of years ago I decided to make Web applications run completly
with/without javascript and with/without CSS and .... These days I would
call this nursing dinosaurs. Nethertheless it saved this project from
getting a runaway.

I am very pleased to this newsgroup and it's responsiveness (I hope
that's the correct phrase). Thanks to all and special thanks to Rob.

Kind regards to all

Stefan
Oct 9 '05 #6
Stefan Finzel wrote:
[...]
Rob, you are totaly right. It seems we have to wait for Windows Mobile
5.0 and a hopefully better implementation of its Mobile IE.


I guess you could try for some other browser, have you looked at Minimo?
Perhaps not yet ready for prime time, but worth looking at:

<URL:http://www.mozilla.org/projects/minimo/>

Apparently it runs on Windows 'Smartphones' and Mobile 2003.

"Minimo 0.007 is for mobile devices running Windows CE and offers many
of the features in Firefox, such as tabbed browsing, support for
plug-ins and has an interface written in XUL, which stands for
extensible user interface language, Chris Hofmann, director of
engineering at Mozilla, said.

"XUL is a set of XML tags developed by Mozilla for describing
graphical user interfaces. The technology supports cascading style
sheets, which is helpful in adapting web pages to the small screens
of cellular phones; JavaScript and resource description language, or
RDF, for storing dynamic content.

"No timetable for general availability of Minimo has been set."

<URL:http://www.internetweek.com/news/166403196>

Checkout the screenshots on various devices. You could also try
handhelds.org for more information abut PDA software in general:

<URL:http://www.handhelds.org/geeklog/index.php>
[...]


--
Rob
Oct 9 '05 #7

RobG wrote:
....
I guess you could try for some other browser, have you looked at Minimo?
Perhaps not yet ready for prime time, but worth looking at:

<URL:http://www.mozilla.org/projects/minimo/>

Apparently it runs on Windows 'Smartphones' and Mobile 2003.

....
A really lovely little browser! Almost all of my javascripts run out of
the box - only window.open seems to be silently ignored (Pocket IE
handles is like a raw link, which is mostly acceptable.)

Was expecting Opera to be supported on PDAs but Minimo looks like a good
alternative.

Mobile Internet Explorer is faster and looks better than Minimo and of
cause it is already installed. But it is nice to have an evolving Minimo
too.

PS: There are some minor problems in Minimo with the cursor which is not
at the input position. Fonts are too large (ignoring style settings?).
Resizing frames using the slider does not work while resizing main
window to much larger than available screen is possible. Using https
even seems to kill Minimo.
Oct 10 '05 #8

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

3
by: Jeff | last post by:
Hi I have a report with a graph on it and want to change the minimum and maximum values for the value axis when it is previewed. This can't be done by adding code in the Open event as once the...
1
by: Jeff | last post by:
Hey asp.net 2.0 I wonder if it's possible to have both standard asp.net and mobile asp.net in the same web application. When the web server gets a request it can detect if this requested...
0
by: beartrax | last post by:
I am using Windows Mobile 2003 SE and trying to change the menu selectable VIEW mode by using javascript or any other programming method within an html page. The menu view modes I would like to be...
4
by: Tugrul HELVACI | last post by:
Changing DisplayNames of my properties using PropertyGrid component, how ?? I'm using Delphi 2006 and I have a class defination like this: TPerson = class fPersonName : String;...
4
by: howa | last post by:
Hello, Any best practice in checking mobile device and re-direct them into mobile page (e.g. wap) ? E.g. User agent, screen size etc.? anything else?
1
by: Claudia Fong | last post by:
Hi, I downloaded the mobile 6 SDK and I'm trying to display my webpages in the mobile 6 emulator, but I'm not able to get into the internet.. the active sync is connected.. When I was using...
4
by: ink | last post by:
Hi All, I am trying to build an image capture user control using DirectShow to be used in an existing C# application. It needs to have a view finder/ preview window and be able to take...
4
by: surja | last post by:
Hi, I have written a code to download images from a server end desktop, but while running the code ,WTK is showing a runtime error " Create image from Byte array Uncaught exception...
6
by: Marc | last post by:
I am reading some stuff in self paced course 728 about mobile applications. But the first thing that comes into my mind is, why do I need to build special server side code, if the browser happens...
2
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 2 August 2023 starting at 18:00 UK time (6PM UTC+1) and finishing at about 19:15 (7.15PM) The start time is equivalent to 19:00 (7PM) in Central...
0
by: erikbower65 | last post by:
Using CodiumAI's pr-agent is simple and powerful. Follow these steps: 1. Install CodiumAI CLI: Ensure Node.js is installed, then run 'npm install -g codiumai' in the terminal. 2. Connect to...
0
linyimin
by: linyimin | last post by:
Spring Startup Analyzer generates an interactive Spring application startup report that lets you understand what contributes to the application startup time and helps to optimize it. Support for...
0
by: erikbower65 | last post by:
Here's a concise step-by-step guide for manually installing IntelliJ IDEA: 1. Download: Visit the official JetBrains website and download the IntelliJ IDEA Community or Ultimate edition based on...
0
by: kcodez | last post by:
As a H5 game development enthusiast, I recently wrote a very interesting little game - Toy Claw ((http://claw.kjeek.com/))。Here I will summarize and share the development experience here, and hope it...
0
by: Taofi | last post by:
I try to insert a new record but the error message says the number of query names and destination fields are not the same This are my field names ID, Budgeted, Actual, Status and Differences ...
14
DJRhino1175
by: DJRhino1175 | last post by:
When I run this code I get an error, its Run-time error# 424 Object required...This is my first attempt at doing something like this. I test the entire code and it worked until I added this - If...
5
by: DJRhino | last post by:
Private Sub CboDrawingID_BeforeUpdate(Cancel As Integer) If = 310029923 Or 310030138 Or 310030152 Or 310030346 Or 310030348 Or _ 310030356 Or 310030359 Or 310030362 Or...
0
by: lllomh | last post by:
How does React native implement an English player?

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.