search

rviscomi / trunk8

jQuery Truncation Plugin -- THIS PROJECT IS NO LONGER MAINTAINED
MIT License
703 stars 95 forks source link

Google Web Fonts Support #32

Open simonferndriger opened 11 years ago

simonferndriger commented 11 years ago

Hi

It looks like trink8 does not work well within Google Web Fonts. It worked just fine when using Arial, however, it cuts the text to short when using Roboto.

Any idea?

Best Simon

rviscomi commented 11 years ago

Strange. Could you provide a link to an example of this not working?

simonferndriger commented 11 years ago

Hi Rick

Unfortunately, I cannot provide a link (since it would be confidential). But I can give you a screenareashot with the complementary code.

Exampe 1 is where it trunk8 too late It works fine with font-size: 10pt, however it stops working with font-size: 11pt.

10pt

11pt

Here is the code for the example above

Exampe 2 is where it trunk8 too early

Best Simon webcams.travel http://www.webcams.travel - Watching The World Am 04.07.2013 05:32, schrieb Rick Viscomi:

Strange. Could you provide a link to an example of this not working?

— Reply to this email directly or view it on GitHub https://github.com/rviscomi/trunk8/issues/32#issuecomment-20457493.

rviscomi commented 11 years ago

@simonferndriger could you make a sample page that demonstrates the problem? You can take out any confidential code or information. I just need a way to reproduce the bug you're describing. Thanks.

simonferndriger commented 11 years ago

OK, I created such a page: http://jsfiddle.net/BVFPv/1/

However, trunk8 seems to not work at all - event though I copied the exact computed style sheets out of the console. (Chrome only)

Maybe it helps anyway?

Best Simon webcams.travel http://www.webcams.travel - Watching The World Am 05.07.2013 01:52, schrieb Rick Viscomi:

@simonferndriger https://github.com/simonferndriger could you make a sample page that demonstrates the problem? You can take out any confidential code or information. I just need a way to reproduce the bug you're describing. Thanks.

— Reply to this email directly or view it on GitHub https://github.com/rviscomi/trunk8/issues/32#issuecomment-20496639.

simonferndriger commented 11 years ago

http://jsfiddle.net/BVFPv/2/

webcams.travel http://www.webcams.travel - Watching The World Am 05.07.2013 01:52, schrieb Rick Viscomi:

@simonferndriger https://github.com/simonferndriger could you make a sample page that demonstrates the problem? You can take out any confidential code or information. I just need a way to reproduce the bug you're describing. Thanks.

— Reply to this email directly or view it on GitHub https://github.com/rviscomi/trunk8/issues/32#issuecomment-20496639.

rviscomi commented 11 years ago

See http://jsfiddle.net/BVFPv/3/

You're attempting to trunk8 all div elements, even the ones that are just wrappers. The key is to separate out the UI from the text. So I added an inline element with a unique class name (too-long) to any text that we want to trunk8.

The custom web font really does not affect the functionality. A real hazard of web fonts could be if they are loaded asynchronously; you could trunk8 too soon (ie DOM ready) when the text is styled with a built-in placeholder browser font. But that doesn't appear to be affecting you here.

simonferndriger commented 11 years ago

Hi Rick

I'm currently very busy, also soon in vacation. I'll come back to this soon.

Best Simon webcams.travel http://www.webcams.travel - Watching The World Am 05.07.2013 09:36, schrieb Rick Viscomi:

See http://jsfiddle.net/BVFPv/3/

You're attempting to trunk8 all |div| elements, even the ones that are just wrappers. The key is to separate out the UI from the text. So I added an inline element with a unique class name (|too-long|) to any text that we want to trunk8.

The custom web font really does not affect the functionality. A real hazard of web fonts could be if they are loaded asynchronously; you could trunk8 too soon (ie DOM ready) when the text is styled with a built-in placeholder browser font. But that doesn't appear to be affecting you here.

— Reply to this email directly or view it on GitHub https://github.com/rviscomi/trunk8/issues/32#issuecomment-20504793.

simonferndriger commented 11 years ago

Hi Rick

Thank you. In the JSFiffle-Example, the span element works. But in the live website, it doesn't:

Best Simon webcams.travel http://www.webcams.travel - Watching The World Am 05.07.2013 09:36, schrieb Rick Viscomi:

See http://jsfiddle.net/BVFPv/3/

You're attempting to trunk8 all |div| elements, even the ones that are just wrappers. The key is to separate out the UI from the text. So I added an inline element with a unique class name (|too-long|) to any text that we want to trunk8.

The custom web font really does not affect the functionality. A real hazard of web fonts could be if they are loaded asynchronously; you could trunk8 too soon (ie DOM ready) when the text is styled with a built-in placeholder browser font. But that doesn't appear to be affecting you here.

— Reply to this email directly or view it on GitHub https://github.com/rviscomi/trunk8/issues/32#issuecomment-20504793.

simonferndriger commented 11 years ago

I'm not sure if the trunk8 is too early. How can you be sure that the font is loaded when using <link href="http://fonts.googleapis.com/css?family=Roboto:400,400italic,700" rel="stylesheet" type="text/css">

? webcams.travel http://www.webcams.travel - Watching The World Am 05.07.2013 09:36, schrieb Rick Viscomi:

See http://jsfiddle.net/BVFPv/3/

You're attempting to trunk8 all |div| elements, even the ones that are just wrappers. The key is to separate out the UI from the text. So I added an inline element with a unique class name (|too-long|) to any text that we want to trunk8.

The custom web font really does not affect the functionality. A real hazard of web fonts could be if they are loaded asynchronously; you could trunk8 too soon (ie DOM ready) when the text is styled with a built-in placeholder browser font. But that doesn't appear to be affecting you here.

— Reply to this email directly or view it on GitHub https://github.com/rviscomi/trunk8/issues/32#issuecomment-20504793.

simonferndriger commented 11 years ago

Ironically, this example works fine WITHOUT the additional span tag:

-> It would probably be best, to execute trunk8 once on document.ready, and again on window.load. But I suspect, that already trunk8ed elements will not be trunk8ed again?

webcams.travel http://www.webcams.travel - Watching The World Am 05.07.2013 09:36, schrieb Rick Viscomi:

See http://jsfiddle.net/BVFPv/3/

You're attempting to trunk8 all |div| elements, even the ones that are just wrappers. The key is to separate out the UI from the text. So I added an inline element with a unique class name (|too-long|) to any text that we want to trunk8.

The custom web font really does not affect the functionality. A real hazard of web fonts could be if they are loaded asynchronously; you could trunk8 too soon (ie DOM ready) when the text is styled with a built-in placeholder browser font. But that doesn't appear to be affecting you here.

— Reply to this email directly or view it on GitHub https://github.com/rviscomi/trunk8/issues/32#issuecomment-20504793.