Click here to Skip to main content
15,793,085 members
Please Sign up or sign in to vote.
1.00/5 (1 vote)
See more:
I want to load the following HTML page in Android webview.

html page[^]
This html page has mobile price. When user clicks on a mobile name, it opens the mobile specs in form of JPG image. Everything is working ok in browser and specs image is being shown in browser.
But, when I load this page in webview of Android app, it loads the page but when user clicks on mobile name in webview, it does not render the image and shows blank area.

What I have tried:

<style>.container {width: 100%;height: 100%;background-color: red;
display: flex;justify-content: center;align-items: center;}
.cl {    width: 720px;height: 440px;}</style>
<div id="mydiv" class="container" onclick="hidediv()">
<div class="cl"><h2 style="text-align: center;"><a>close</a></h2>   
     <img id="my-image" /></div></div>

<style type="text/css">
<table id="T_dab97">
  <caption>Updated on: 20-09-2023</caption>
      <th class="blank level0" > </th>
      <th id="T_dab97_level0_col0" 
         class="col_heading level0 col0" >Mobile</th>
      <th id="T_dab97_level0_col1" 
         class="col_heading level0 col1" >Storage/RAM</th>
      <th id="T_dab97_level0_col2" 
         class="col_heading level0 col2" >PKR</th>
      <th id="T_dab97_level0_col3" 
         class="col_heading level0 col3" >USD</th>
      <th id="T_dab97_level0_row0" 
         class="row_heading level0 row0" >1</th>
      <td id="T_dab97_row0_col0" class="data row0 col0" >
      <button id='SamsungA04e' type='button' value='SamsungA04e' 
      onclick='SamsungA04e()'>Samsung A04e</button></td>
      <td id="T_dab97_row0_col1" 
      class="data row0 col1" >3/32 GB3/64 GB</td>
      <td id="T_dab97_row0_col2" class="data row0 col2" >33999</td>
      <td id="T_dab97_row0_col3" class="data row0 col3" >$. 116</td>

<script type="text/javascript">
function hidediv(){document.getElementById('mydiv').style.display='none';}
function SamsungA04e(){myImage=document.getElementById('my-image');

wv.Source= ""+fn+".html";

    <WebView x:Name="wv"
Updated 20-Sep-23 4:53am
Richard MacCutchan 20-Sep-23 5:09am    
You need to provide more information. It is impossible for anyone to guess what is wrong with your page.
suhail malik 2023 20-Sep-23 6:04am    
plz have a look at this link
it has a html table consisting mobile prices when we click on mobile name it shows its specs image in separate div having z-index of 9 its working perfect on windows but in android maui webview everything works ok but specs image doesnt shows in div plz plz help me sir
Richard MacCutchan 20-Sep-23 6:19am    
Please do what I already suggested: use the Improve question link above, and add complete details of what is not working.
suhail malik 2023 20-Sep-23 8:41am    
ok sir, I have updated the question. Ihope this update will simplify my question. please have a look.
Richard MacCutchan 20-Sep-23 8:50am    
I do not use MAUI and I have no way of testing your code. However, I would question the use of fixed sizes for height and width of your image, when using a mobile device. Also, in future please format your code so it is readable: one statement per line, rather than continuous run-on.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900