I'm working on a project that contains many tables which need to be editable for translation. Unfortunately, Articulate Storyline doesn't support tables so I've had to draw them as columns of text with lines beneath each row. I've published for HTML5 and found that lines wtih 1px weight don't appear on screen. They are visible in the swf output though. I can use 2 px lines as a workaround, but the heavier line weight isn't very nice. Can anyone suggest how I might get my 1px lines to appear on-screen?
I haven't heard of this issue before, but I may have a suggestion that could help. You could try selecting your entire table and save it as a picture.
Select multiple lines by clicking and dragging over all of the lines, or hold down your CTRL key and click each separately. Another option would be to hold down CTRL and select each line object in the timeline. Once you have them all selected, right-click on the selection and choose "Save as picture".
Save the picture, then insert the picture that was created. Republish for HTML5 and test.
Also, please be sure that you're not viewing your published files locally - if this is how you're testing, that may be what's causing the display issue in the output.
To properly test your published content and share it with others, upload it to the environment for which it was published. Please review the article below for more information:
If you do not have access to a web server or LMS for testing, you could try using SCORM Cloud.
Another option would be to use our Tempshare server. Just keep in mind that this server is only available for testing content - it is not officially supported by Articulate and all content will be removed automatically after 10 days.
You're always welcome to try out Articulate Online, as well - it's available for a free 30 day trial.
I need to keep everything editable for translation purposes (including the lines as they may need to move when text re-flows) so I tried your suggestion of not hosting locally but it didn't make a difference. The only thing that seems to work reliably is making the lines thicker.
I've attached a zip containing an example of a table with 1px lines that don't show, as well as one with 1px lines that do. It looks like the lines that do show aren't perfectly horizontal - when I check the size and position, the size displays as 2px even though the line weight is 1px. I'd be interested to know if you can make the properly horizontal lines visible when published in HTML5.
Thanks for the additional information and the files. However, it looks like you shared the published output. The problem with this is that I cannot run it properly for testing and I cannot actually look at the project file.
If you can share the .STORY file, that would be best :) If you like, you can share a slide with the version of the lines that works and a second slide with the lines that do not display in the HTML5 output.
Hi Christine, the .story file is in the zip folder too (line test.story). This file includes a slide with lines that don't display (first slide), and one with lines that do (second slide).
I included the published files so you could see what I get when I publish it so it is apparent whether or not your output is different.
I tested both versions in the following web browsers:
Google Chrome - Version 34.0.1847.116 m - Flash displays correctly, HTML5 does not.
Mozilla Firefox - Version 28.0 - Both Flash and HTML5 display correctly.
Internet Explorer - Version 11.0.9600.17031 - Both Flash and HTML5display correctly.
Safari - Version 5.1.7 - Both Flash and HTML5display correctly.
Maxthon - Version v4.2.1.1000 - Both Flash and HTML5display correctly.
Can you tell me what environment you're using to view the HTML5 output? Are you testing via Chrome as well? So far, this is the only browser that is not displaying the 1x lines on the first slide.
Something else I noticed, and I'm not sure if this will make a difference;
When I select the lines on the first slide, the pixels for the lines are actually displaying as "0". The lines are displaying correctly as "2" on the second slide.
Might be something to look into, but first I'd like to find out if this is only happening with Chrome on your end as well.
5 Replies
Hi Tess,
I haven't heard of this issue before, but I may have a suggestion that could help. You could try selecting your entire table and save it as a picture.
Select multiple lines by clicking and dragging over all of the lines, or hold down your CTRL key and click each separately. Another option would be to hold down CTRL and select each line object in the timeline. Once you have them all selected, right-click on the selection and choose "Save as picture".
Save the picture, then insert the picture that was created. Republish for HTML5 and test.
Also, please be sure that you're not viewing your published files locally - if this is how you're testing, that may be what's causing the display issue in the output.
To properly test your published content and share it with others, upload it to the environment for which it was published. Please review the article below for more information:
Publishing and Sharing Articulate Storyline Content
If you do not have access to a web server or LMS for testing, you could try using SCORM Cloud.
Another option would be to use our Tempshare server. Just keep in mind that this server is only available for testing content - it is not officially supported by Articulate and all content will be removed automatically after 10 days.
You're always welcome to try out Articulate Online, as well - it's available for a free 30 day trial.
Let me know how it goes :)
Thanks!
Thanks Christine.
I need to keep everything editable for translation purposes (including the lines as they may need to move when text re-flows) so I tried your suggestion of not hosting locally but it didn't make a difference. The only thing that seems to work reliably is making the lines thicker.
I've attached a zip containing an example of a table with 1px lines that don't show, as well as one with 1px lines that do. It looks like the lines that do show aren't perfectly horizontal - when I check the size and position, the size displays as 2px even though the line weight is 1px. I'd be interested to know if you can make the properly horizontal lines visible when published in HTML5.
Many thanks for your help.
Hi Tess,
Thanks for the additional information and the files. However, it looks like you shared the published output. The problem with this is that I cannot run it properly for testing and I cannot actually look at the project file.
If you can share the .STORY file, that would be best :) If you like, you can share a slide with the version of the lines that works and a second slide with the lines that do not display in the HTML5 output.
Thank you!
Hi Christine, the .story file is in the zip folder too (line test.story). This file includes a slide with lines that don't display (first slide), and one with lines that do (second slide).
I included the published files so you could see what I get when I publish it so it is apparent whether or not your output is different.
Thanks for looking into it.
Hi Tess,
I'm so sorry about that - I didn't see the .STORY file, I reacted when I saw all of the published output files. I see it now, in the output folder.
I published and uploaded the project for testing:
I tested both versions in the following web browsers:
Can you tell me what environment you're using to view the HTML5 output? Are you testing via Chrome as well? So far, this is the only browser that is not displaying the 1x lines on the first slide.
Something else I noticed, and I'm not sure if this will make a difference;
When I select the lines on the first slide, the pixels for the lines are actually displaying as "0". The lines are displaying correctly as "2" on the second slide.
Might be something to look into, but first I'd like to find out if this is only happening with Chrome on your end as well.
Thanks!
This discussion is closed. You can start a new discussion or contact Articulate Support.