I am trying to port a website to an Android Tablet using KitKat 4.4.
WebView vendWebView = (WebView) findViewById(R.id.webview);
WebSettings webSettings = vendWebView.getSettings();
// Enable JavaScript
webSettings.setJavaScriptEnabled(true);
vendWebView.setWebViewClient(new WebViewClient());
vendWebView.loadUrl("https://xxxxxxx.xxxxxx.com/");
The website works on a Chrome browser but not all of the HTML works on the Android Chrome web browser. Should the website be portable from the Chrome PC browser to the Android browser.
Thanks
The specific HTML that is not working on the Android browser but works on a PC Chrome browser is -
<div id="quick-keys" class="sell">
<div id="menu" class="quick-key-menu">
<ul></ul>
</div>
<div id="list">
<ul></ul>
</div>
<div id="pages">
<ul></ul>
<i class="icon-quick-keys-pagination-previous"></i>
<i class="icon-quick-keys-pagination-next"></i>
</div>
<div id="quick-key-default">
<div class="quick-key-menu">
<ul>
<li style="width: 516px;">
Quick Keys </li>
</ul>
</div>
<div class="striped-box">
Set Up Quick Keys
<p>Quick Keys let you configure a grid of buttons <br />to quickly add products to a sale.</p>
</div>
</div>
</div>
</div>
Have you seen the page for migrating WebViews to 4.4?
There are a number of changes in 4.4 to WebView handling, one thing may be to setWebContentDebuggingEnabled and seeing what the WebView is actually receiving.
Does the WebView work as expected in previous versions?
(Sorry I wanted to make this a comment but I would have lost a lot of formatting)
Related
When scrolling on mobile background is overflow. It looks normal on Chrome devtool but not in mobile device. Where did i get it wrong?
<div class="bg[url('../dist/images/somepic.jpg')] bg-cover bg-center h-screen overflow-clip">
<div class="absolute bottom-0 w-full items-center justify-center md:bottom-0 h-[150px] bg-white z-10 p-4">
<div class="flex justify-between items-center mx-auto px-4 pt-4">
asfa
</div>
</div>
</div>
<div>
<p>lorem50</p>
</div>
I have tried overflow-clip overflow-hidden overflow-auto, have tried with bg-color without bg pict. Viewport meta tag already as it should be.
Im currently working on a website for a client and am having some trouble getting a whatsapp link working on an Iphone. There is a button that should be redirecting the user to a whatsapp number, and it is doing to on my pc, but when I take it to my iphone suddenly it no longer works. Any ideas on what is happening?
<a id="app" target="_blank" href="https://wa.me/0896168600?text=I'm%20interested%20in%20man%20with%20a%20van"> <div class="whatsapp">
<div class="left">
<p>Contact on WhatsApp</p>
<p>089 61 68 600</p>
</div>
<div class="right">
<img src="/WhatsApp.svg.png" alt="">
</div>
</div>
</a>
Here are some images of the problem in action aswell as the link to the website and the whatsapp documentation used to write the code.
https://i.stack.imgur.com/YW5nW.png
https://faq.whatsapp.com/iphone/how-to-link-to-whatsapp-from-a-different-app/?lang=en
https://fiverrtestsite.netlify.app/
Please try this for mobile
So for a danish number +45 1234 5678 it would be
4512345678
Change 45 to your contry code
<a id="app" target="_blank" href="whatsapp://send?phone=4512345678"> </a>
OR
<a id="app" target="_blank" href="https://api.whatsapp.com/send?phone=4512345678"> </a>
This will only work for mobile, not for desktop. You shuld make a modal so when its clicked they can choose to open mobile or desktop version of the link.
I have a working Cordova iOS app. Now I am working on an Android app. I have a "contact us" page where I have a link:
<a id="lnkEmail" style="border: none;box-shadow: none;text-align: left;" data-role="button" href="#"> support#website.com </a>
$('#lnkEmail').on('click',function(){
document.location.href = "mailto:support#site.com";
});
The page is redirected to a "webpage not available" error page while the link opens in an email client. How do I stop page redirection? I have tried:
<a style="border: none;box-shadow: none;text-align: left;" data-role="button" **href="mailto:support#site.com"** target="_top">support#site.com </a>
As well as:
<a id="lnkEmail" style="border: none;box-shadow: none;text-align: left;" data-role="button" **href="javascript: void(0);"**>support#site.com</a> support#site.com </a>
How can I fix this ?
There is a bug on how the mailto is handled and it try to navigate to the page before loading the email client.
You can try using inAppBrowser plugin
window.open('mailto:support#site.com', '_system');
I am new to web dev and android and am trying to develop a web app with phone gap and also using jquery mobile for that.
I am trying to view and display my webpage within the mobile screen with headers and footers also added through jquery code.
The code which i have written to display the webpage does display for eg http://www.msn.com but when i give for eg http://46.137.... (obviously thats a incomplete address) it does not work . Bytheway the alert is shown in both the cases. Below is the code
<div id="cnt" data-role="content">
<script>
$("#cnt").load("http://46.137....", function() {
alert('Load was performed.');
});
</script>
<!-- <iframe src="http://46.137...."></iframe> -->
</div><!-- /content -->
Hey #LivingThing try like this,
...
<div id="video1" data-role="content">
<iframe id="cnt" width="560" height="315" frameborder="0" allowfullscreen></iframe>
</div>
...
<script>
function l() {
document.getElementById('cnt').src = "http://www.cnn.com/US/index.html"
}
$(window).load(function() {
l()
alert('Load was performed.');
});
</script>
All this into <div data-role="page">
I hope this helps. :)
I am using the following code in my Webview along with Jquery Mobile, This works fine in the emulator (2.2 ) and on my Nexus one but some users are complaining that when they click on a link they get an error message "Problem with File: Requested file not found". One user reported that she was using Samsung Fascinate with "2.2.1" . This seems to have started when I upgraded jquery mobile 1.0b2 , I have tried the latest 1.0rc but still have the same issue
Any Insights on what might be happening ?
In my Activity
engine.loadUrl("file:///android_asset/book2/www/newindex.html");
In the html ( I have also tried data-ajax="false" )
<link rel="stylesheet" href="jquery/jquery.mobile-1.0rc1.min.css" />
<script type="text/javascript" src="jquery/jquery.mobile-1.0rc1.min.js"></script>
<div data-role="page" id="jqm-home">
<div data-role="content" data-theme="e">
<div class="content-primary">
<nav>
<ul data-role="listview" data-inset="true" data-theme="e" data-dividertheme="d" >
<li data-role="list-divider">Cognitive</li>
<li><a rel="external" href="./cogn/simon2.html">
<img src="cogn/simon.jpg" />
<h3>Simon says</h3>
<p>Memory</p>
</a></li>
From what I know about URL loading, if you are loading a local file, which is what it looks like here, that file needs to be in the same directory as the file its linking from. Because the file is local on your computer, your device and emulator should work fine. for someone else who downloads the app and tries to use the Webview functionality, that source file would need to be stored in their phone and in the appropriate directory...hope that helps.