Does Palm/HP WebOS 3.o / Enyo framework support image maps??
I have an HtmlContent control that contains "image maps" -- an image with links embedded in hot spots using the HTML "usemap" attribute. However my those links don't seem to be active, and I cannot click on them. (The same page when opened in a regular browser allows me to click, but when that HTML content is in an HtmlContent control, the links seem to have disappeared).
Any ideas?
Also i did check that the click events are not being fired -- the click handler for the HtmlContent control does not fire. This does not happen when the entire image has an href -- in that case things work fine. But if the image has a map associated with it, then the links are not active, and clicking on the link regions does not seem to fire click events.
It's not Enyo that needs to support imagemaps, but the lower level WebKit system. Right now, webOS should handle rectangular image maps, but polygon maps weren't being handled correctly.
Related
I am fond of the type of side navigation menu that is common in mobile apps. An example is: http://www.jqueryscript.net/menu/jQuery-Animated-Side-Navigation-Menu-Plugin-Sidebar.html
Which works also for web pages. However, the vast majority of my page is in KendoUI, and I don't want to load another framework just for that.
Is there a combination of tricks with Kendo (draw control for example) that I could use to get the same effect?
Alternatively, I am all wet. I just want a quick way to have a "pop-up" of settings that are only occasionally used, and most of the time save the screen real-estate. So maybe just a button and a pop-up window is the correct approach?
Any advice?
I'm trying to find some docs to learn how to make phonegap app for windows phone, using native frame transition for HTML pages, but I cannot find such a plugin or code or any helpful doc.
What exactly I want to do is:
when I try to navigate to other page in HTML code using javascript code:
window.location.href = "newpage.html";
I want my app to navigate to different page like native app is doing transition effect, for example when app start we can see this page/frame transition effect.
How to do that transition effect for HTML pages ?
You should look at using jQuery Mobile to build HTML pages for a Phonegap app.
http://jquerymobile.com
It's useful because it has a built-in router, which can detect when you try to change to another HTML page. (either programatically or via a user clicking on links)
It then can hijack that event and make it load the next page asynchronously (which in the case of a Phonegap app, is pretty fast since the pages already exist on the device). It then applies the transitions you speak of when it displays the new page (slide, fade, etc).
It's quite customisable, and most of the behaviour is configured by just creating simple HTML markup and adding data attributes. E.g.
next page
I also like it because if you decide you want to go down the "single page app" route - you can do that too. I personally like the combination of Phonegap + jQuery Mobile + Backbone.js, where Backbone.js is dynamically generating my HTML jQuery Mobile pages, and Phonegap is wrapping them up in an app.
I am developing an advertisement in my application. I showed the advertisement in the webbrowser correctly. Now when double click on the webbrowser the content is zooming, But I want to programatically zoom the content of the webbrowser. (Want to zoom the content in webbrowser when the application launches, not double clicked by the user). How can I zoom the webbrowser content programatically ?..Is it possible ?
This is not directly supported by the WebBrowser control. However, you might be able to make this work by digging around in the internals of the control. I recently published a blog post which looked at suppressing pinch and double-tap zoom interactions. This was achieved by inspecting the visual tree of the WebBrowser:
\-WebBrowser
\-Border
\-Border
\-PanZoomContainer
\-Grid
\-Border (*)
\-ContentPresenter
\-TileHost
Then handling interactions on the indicated Border (*). You might be able to find a way to emulate interactions in order to cause the browser to zoom.
If you have control over the content being loaded in WebBrowserControl, you may consider adding this meta to the source.
<meta name="viewport" content="width=480,user-scalable=no"/>
What Colin said is right, you cannot otherwise capture any manipulation events. But here on changing the margin of the webBrowser control you can see the zoom. So you need not take so much of work. So you can programmatically control the zoom to some extent. And if you need the zoom to be more specific to certain area of the web page, I suggest you to go for working on javascript. I am not sure if you can do with the sdk we have.
If you want to disable the zoom on user click what Apurv said works, but it gives a weird effect on double clicking. If you are not happy with that you will need some work arounds.
If I limit WebBrowser's height, and content is longer, scrollbar is created inside the WebBrowser (effectively, HTML page is long), similar to IE in WP7. This scrollbar behaves the way I want to - after swift swipe it continues to scroll, slowing down.
But if I place a div with a scrollbar in the WebBrowser content, this scrollbar behaves like regular HTML scrollbar, it does not keep scrolling after user stops touching the display.
Is there a way to make this work too ?
Thanks
No, not easily. The WP7 IE9 browser control supports the overflow:scroll CSS property that allows the user to scroll content within the current page. It is worth noting that most Android and iPhone browsers do not support this, although it has been added in iOS5. None of these browser support inertia scrolling for overflow:scroll, WP7 included.
The only way to get inertia scrolling for overflow content is to do it yourself using JavaScript. For WebKit browsers there is a popular library, iScroll, that provides this functionality. However, it does not work for WP7 (due to lack of CSS3 3D transforms that are used to push the scrolling content onto a different layer for hardware acceleration) - so you will need to write your own implementation. Good luck!
This feels like a dumb newbie question. I'm attempting to follow the Palm's online tutorial for developing a webOS app. I ran palm-generate and tried updating the generated index.html file to have a body with a bunch of content (the word "HELLO" repeated 400 times).
When I attempt to load that document in the emulator, I find that I'm unable to scroll the screen to read the rest of the text. I drag the screen, but nothing happens. The page scrolls just fine in the Palm web browser.
Is there a setting to allow users to drag my app to scroll it? I see documentation for a Mojo.Widget.Scroller, but that seems like it shouldn't be necessary for a simple web page with a bunch of text on it.
Thanks to arthurthornton:
You can take anything that would normally be inside the tags and put that inside the scene HTML file.
OR you could just make a basic scene with a webview widget inside it that has your site as the source.
Unfortunately, the Scroller widget is needed for scrolling. The standard WebKit view that's shown in a card has no native scrolling ability, so the Mojo scroller widget implements the logic for displaying more content that can fit.
You can try this out by making a new project in the Ares IDE. Just add a Scroller and use the Maximize button to make it fill the scene. Then, add a HTML object to it, and add your HTML content to that object. You'll then have a nice scene which allows you to scroll through a lot of content.