Simple HTML5 example in a HTML Content Module

This is an open forum for any mojoPortal topics that don't fall into the other categories.

This thread is closed to new posts. You must sign in to post in the forums.
3/27/2013 1:04:02 AM
Gravatar
Total Posts 11

Simple HTML5 example in a HTML Content Module

Does anyone have a simple example of some HTML5 that you can put into a HTML Content module that I've inserted into a page?

Even if it's drawing a line on a canvas, that would help.

I've tried to put some HTML5 into it and I've had no success.

Any help would be appreciated.

Cheers,

Vadim

3/28/2013 9:59:42 AM
Gravatar
Total Posts 18439

Re: Simple HTML5 example in a HTML Content Module

The wysiwyg editors CKeditor and TinyMCE tend to have some cleanup logic that can change the markup you enter. If you need to do something complicated/specialized it is probably best to disable the wysiwyg editor from the content instance settings in the Html content feature then you can enter raw html in a textarea and it won't mess with whatever you put in there. We do this also when using javascript in the content to avoid problems.

Hope that helps,

Joe

3/28/2013 1:13:20 PM
Gravatar
Total Posts 11

Re: Simple HTML5 example in a HTML Content Module

Joe, you rock!!

Thanks for getting back to me so quickly.  I'll try this out as soon as I can.

cheers,

Vadim

3/29/2013 12:54:43 AM
Gravatar
Total Posts 11

Re: Simple HTML5 example in a HTML Content Module

Hi Joe,

thanks for the idea.  I tried it out and it helped when looking at the page in Firefox, but for some reason, in IE, I get a "Your browser does not support the HTML5 canvas tag".  But if I put that into a standalone html file and open in a new tab in the same IE process, it renders fine.

Have you ever encountered this before?

It's very simply HTML5 to just test this out.

<canvas id="myCanvas" width="200" height="100"
         style="border:1px solid #c3c3c3;">
Your browser does not support the HTML5 canvas tag.
</canvas>

<script>

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.fillStyle="#FF0000";
ctx.fillRect(0,0,150,75);

</script>

3/29/2013 1:12:36 AM
Gravatar
Total Posts 11

Re: Simple HTML5 example in a HTML Content Module

I wonder if it's the Skin I'm using and the same IE process had no issues rendering that HTML5 on the MojoPortal demo site.

 

3/29/2013 8:31:57 AM
Gravatar
Total Posts 18439

Re: Simple HTML5 example in a HTML Content Module

What kind of DOCTYPE do you have in the layout.master file of your skin. I would think you need to use an html5 doctype in order to use html 5 markup, as well as use a browser that supports it.

Hope that helps,

Joe

3/29/2013 9:25:39 AM
Gravatar
Total Posts 11

Re: Simple HTML5 example in a HTML Content Module

Hi Joe,

that layout.master has the following:

<!DOCTYPE html>

The browser I'm using was able to render the html5 find when it's on the MojoPortal demo site. But on my test site (not online yet), it's not happening.  I tried different skins to see if that was it, but it's the same for all.

But on a site where I'm using MojoPortal and it is online, the same HTML5 snippet works fine.  Very bizarre.

3/29/2013 9:34:26 AM
Gravatar
Total Posts 18439

Re: Simple HTML5 example in a HTML Content Module

You should probably wrap your javascript inside:

$('document').ready(function () {

});    

it may not work consistently if the page is not yet fully loaded

Hope that helps,

Joe

You must sign in to post in the forums. This thread is closed to new posts.