[Cesar R]

Hi, on the Tactics page of my website http://chess-instructor.com, I’m using an iframe to display a javascript-based chess app.

How can I leverage your framework so that when my website is being viewed on an iphone or android device, I can display a smaller view of the app?

I was envisioning something like the following code, but it doesn’t work:

<script type="text/javascript">
var uagent = navigator.userAgent.toLowerCase();
if (uagent.search("iphone") > -1) {
   document.getElementById('myiframe').src = "/chess-puzzles/demo-tactic-training-280.html";
else
   document.getElementById('myiframe').src = "/chess-puzzles/demo-tactic-training-400.html";
}
</script>

I would appreciate your guidance and assistance.

Thank you!
Cesar R

[Sakin]

@Cesar R: Sorry this is not directly related to theme and I am not aware of script that you are using to support your code. Your Tactics should have responsive embed code then it will be fine. But when I check your page, it is using fixed height and width embed code. So, you need to get help from that code provider.

[Cesar R]

Hi Sakin,

I don’t think I worded my question appropriately. The theme obviously has code that detects whether the website is being displayed on a mobile device.

I was wondering if there is a way to hook into that code so that I’m able to display an appropriate sized version of the tactics app?

I’m currently working on updating the code so that the app can resized or perhaps responsive.

Does that make sense?

Thanks again for your services!

[Cesar R]

Hi Sakin,

I was able to customize the javascript being used for the diagrams, so that it is now responsive. The diagram is looking good on all devices.

Thanks for your response as I was thinking that by customizing the theme I would be able to achieve this effect. But it is clear now I needed to adjust the diagram code.

Cesar

[Sakin]

@Cesar R: Yes, you are right and thanks for understanding. Cheers 🙂

[Author]

Posts