[cbz1622]

Hi,

I am trying to access my URL under test (in Test Center) and observed that the data icons that were given as part of our buildkit did not appear as expected. These icons are exclusively designed for us using HTML data-icons and the observation on the DOM viewer is that though these icons are read, they are not displayed correctly.

Please see the screen grab attached.

Can you please let me know what i should be doing to get it as expected?

Cheers,
Ram

Attachments:

You must be logged in to view attached files.

[cbz1622]

Support,

I was expecting a reply for my previous post that was made a couple of days back.

This is my first post after purchasing the mobione. Please do let me know about the issue, as your support will decide whether or not to buy more licences.

Cheers!

[support-octavio]

@cbz1622,

Could your share your project with icons for a better understanding of the problem? Send us a zip file to support at genuitec dot com, use title: “mobione data from cbz1622, icons issue”

[cbz1622]

This is the HTML markup for the basket. As you can see the data-icon=”b” is what displays the basket icon:
<div class=”icon icon-basket” data-icon=”b”></div>

This is then displayed using @font-face in the CSS:
@font-face {
font-family: ‘tescoicn’;
src:url(‘../fonts/tescoicn.eot’);
src: url(‘../fonts/tescoicn.eot?#iefix’) format(‘eot’),
url(‘../fonts/tescoicn.svg’) format(‘svg’),
url(‘../fonts/tescoicn.woff’) format(‘woff’),
url(‘../fonts/tescoicn.ttf’) format(‘opentype’);
font-weight: normal;
font-style: normal;
font-variant: normal;
}

The basket should look like the “img1” attached.

However the MobiOne emulator is not recognizing the data-icon attribute and instead is only displaying the letter alternative to the icon (refer to img2).

Attachments:

You must be logged in to view attached files.

[support-michael]

Hi Ram,

It’s hard to say what’s goofed from the brief description. The screenshots are helpful but I need some additional info:

1) you mention data-icon, are you testing a jquery mobile UI in the MobiOne Test Center?

2) how did you build it? Did you use the MobiOne Visual Designer to create any part of your app?
– I assume no as one of your screenshots includes http://tesco-direct&#8230;.

3) can you share a URL to your site and scenario that I can load and investigate? if you want to keep data in privacy send us the url to support at genuitec dot com.

[cbz1622]

Hi,

http://www.icomoon.oi
http://css-tricks.com/html-for-icon-font-usage

These 2 websites both use data-icons and can be viewed without any issues in a browser. However when viewed in the MobiOne emulator we are presented with this error message. This is the same error message that we receive for every website that uses data-icons.

Could please check from your end and let us know if you are facing the same issue as well when accessing these links from mobione?

Attachments:

You must be logged in to view attached files.

[support-octavio]

@cbz1622,

I’m not able to open http://www.icomoon.oi/ in my computer even in Chrome or Test Center. We will continue investigating tomorrow with dev team assistance.

[cbz1622]

Hi,

There is a small correction in the URL. Could you please test with the below two URLs and let us know if you can access it through mobione?

http://www.icomoon.io
http://css-tricks.com/

It’s really appreciated if you can get back to us on this at the earliest.

Regards,
Ram

[support-octavio]

Hi Ram,

Both URLs render fine for me in Test Center. See image:
See attachment icon-url.png

Attachments:

You must be logged in to view attached files.

[mriehema]

Hi,

my icons are not displayed too.

You can check the icons at: http://www.zurb.com/playground/foundation-icons
See attachment broken-icons.png

System:
MobiOne Studio – Test Center
Version: 2.3.1
Build id: 20130121
Windows 7 64bit

Attachments:

You must be logged in to view attached files.

[support-octavio]

Hi mriehema,

This is a known issue in Test Center. We are working on a replacement technology for the Test Center now that will resolve this and other deficiencies.

[Author]

Posts