Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Web and WebWorks Development

Reply
New Developer
brianjoly
Posts: 2
Registered: ‎05-18-2009
My Device: Not Specified

Black lines appearing under images on BlackBerry Bold and Storm

I am developing a mobile web site and I've noticed some odd behavior on the BlackBerry Bold and Storm.  For the most part, eveything renders just fine but a black line appears under some images. Changing the zoom or refreshing often eliminates the black line.  Anyone know what could be causing these black lines to appear?

 

 

Please use plain text.
Guru I
Xandrex
Posts: 18,382
Registered: ‎07-29-2008
My Device: Z10 10.1.0.2312 / Playbook 2.1 / 8900 5.0
My Carrier: Vodafone France (SFR) & B&You

Re: Black lines appearing under images on BlackBerry Bold and Storm

is the image inside a link element ?



The search box on top-right of this page is your true friend, and the public Knowledge Base too:
Please use plain text.
New Developer
brianjoly
Posts: 2
Registered: ‎05-18-2009
My Device: Not Specified

Re: Black lines appearing under images on BlackBerry Bold and Storm

The black line that appears seems to be restricted to linked images and <input type="image" src="path/to/image">.  The black line is not HTML, however.  Borders are set to 0 and text-decoration is set to none for the link styles.  Further evidence of this is that when altering the zoom, the lines will offten disappear. The images are all JPGs.    Possibly some kind of artifact from rendering the image?  
Please use plain text.
Guru I
Xandrex
Posts: 18,382
Registered: ‎07-29-2008
My Device: Z10 10.1.0.2312 / Playbook 2.1 / 8900 5.0
My Carrier: Vodafone France (SFR) & B&You

Re: Black lines appearing under images on BlackBerry Bold and Storm

when you use a BlackBerry Browser with a scrollwheel or a trackball, you need some kind of :hover feature. There is one that sometimes put some static marching ants around an image you are focusing on (without clicking on it).



The search box on top-right of this page is your true friend, and the public Knowledge Base too:
Please use plain text.
New Developer
RwwL
Posts: 2
Registered: ‎06-29-2009
My Device: Not Specified

Re: Black lines appearing under images on BlackBerry Bold and Storm

Just giving this topic a bump -- I see this issue exactly as the the original poster described on a project I'm working on, and still haven't found a workaround that will fix it. Any chance someone from RIM can speak to this?
Please use plain text.
New Developer
Pring4
Posts: 1
Registered: ‎09-11-2009
My Device: Not Specified

Re: Black lines appearing under images on BlackBerry Bold and Storm

I'm noticing the same issue. For me it happens on most background-images. Still no response from RIM?
Please use plain text.
BlackBerry Development Advisor
tneil
Posts: 3,708
Registered: ‎10-16-2008
My Device: Z10
My Carrier: Rogers

Re: Black lines appearing under images on BlackBerry Bold and Storm

[ Edited ]

From what I understand, when zooming in and out, all the sizing of images and content is based on percentages.  So what can happen is that when you run percentage scaling on an image it can end up having rounding errors.  So sometimes it is right and sometimes it is wrong depending on the content provider and their desired result for the page.

 

To give you an example,  say you had an image that was 33 pixels wide and you had a zoom rate that was a multiplier of 50%.  That means that your image after the zoom is 16.5 pixels wide.  As you can imagine, you cannot display 1/2 a pixel. In either scenario if the browser rounds up or rounds down it is going to be wrong for someone.  Either it will be too wide or too skinny.  In the case where it rounds down, you can sometimes see a line where the surrounding element may have rounded up.

 

My guess is that when you have an image that is imbedded in an anchor hyperlink and the image scaling rounds down and the hyperlink rounds up, you will get the black line.  It would likely be the same scenario if the image was in a table cell that scaled in the opposite rounding than the image.

 

I know the Browser team had been looking at this issue, but I can't say for sure if there has been any resolution for it in browser's yet to be released. 

 

But at least I think it explains what you are seeing. 

 

What you might be able to try is having your image sizes that are even numbers in height and width where most zooming percentages would not result in fractions of pixels.  Sounds like a bit of a black art I know, but give it a shot and see if it helps out. 

Message Edited by tneil on 09-11-2009 09:56 PM
Tim Neil
Director, Application Platform & Tools Product Management
Follow me on Twitter
Please use plain text.
New Developer
RwwL
Posts: 2
Registered: ‎06-29-2009
My Device: Not Specified

Re: Black lines appearing under images on BlackBerry Bold and Storm

Tim, thanks for chiming in. In response to this:

 


[snipped] My guess is that when you have an image that is imbedded in an anchor hyperlink and the image scaling rounds down and the hyperlink rounds up, you will get the black line.  It would likely be the same scenario if the image was in a table cell that scaled in the opposite rounding than the image.

Just want to note for the Brower team, as it appears you're in touch with them, that this issue doesn't necessarily require the image be inside a link to show the black line. I've observed this rendering issue on both standalone images and CSS background images as well.

 

Please use plain text.