0

First I wound like to clarity i am not asking for code.

This code work on html 5.

I create basic page in drupal and implement same code:

<div data-top="opacity: 1" data--400-top="opacity: 0" class="abc"></div>

Drupal treat data as text and print this:

data-top="opacity: 1" data--400-top="opacity: 0" class="abc"

Do I need any module to enable html5 data attributes?

I am using FULL HTML and I have no idea how to solve.

Many Thanks.

  • make sure to change the input format as "FULL HTML" – Krishna Mohan Jun 11 '15 at 7:41
  • Yup I am using FULL HTML or else other code dun work as well. – peifa Jun 11 '15 at 7:43
  • Are you using a WYSIWYG? If so which one? – Clive Jun 11 '15 at 8:27
0

I am not using this module. Try once this module, hope you will get some configuration settings.

  1. HTML5

This theme will be the official back-port of the theme-related work done in the Drupal 8 HTML5 initiative. We want everyone to be able to preview what's coming in Drupal 8 from a markup and CSS perspective. We want anyone to be able to easily review our progress without needing to create another install of an unstable, or unfamiliar version of Drupal.

  1. HTML5 Tools

HTML5 Tools is a module that allows Drupal sites to be built using HTML5 ... smartly.

One of our goals is to provide as much support for HTML5 markup in a set of Tools provided by a module so that you can use this module with any HTML5 theme you'd like.

  1. HTML5 Media

This project has one goal. To bring a standardized, Open Source GPL front end media solution to Drupal core. This project is completely open and has no other intentions other than to provide a standard front end media solution that will benefit the entire Drupal community, so therefore, whoever would like to help in this initiative is welcome to contribute!

| improve this answer | |
0

use html.tpl.php and put <!DOCTYPE html> to top. save html.tpl.php on the theme folder and clear all caches. now all of your theme base on html5

| improve this answer | |
0

I using java-script to rewrite the code. Pretty stupid solution but it works. Hope there is better solution.

using DOM

document.getElementById("test2").innerHTML = "<div data-bottom-top=\"transform[swing]: scale(0.5) rotate(120deg)\" data-100-top=\"transform[swing]: scale(1) rotate(0)\" class=\"right\"></div>";
| improve this answer | |
  • Oh great. Please update your answer with that js. It help for others. – Nishant Jun 11 '15 at 8:13
  • Not much just use DOM: document.getElementById("test2").innerHTML = "<div data-bottom-top=\"transform[swing]: scale(0.5) rotate(120deg)\" data-100-top=\"transform[swing]: scale(1) rotate(0)\" class=\"right\"></div>"; I still prefer yours solution or Alireza methods. – peifa Jun 11 '15 at 8:46
  • Ok try mine solution as well as @Alireza solution. If you will get any proper solution then update here. – Nishant Jun 11 '15 at 8:52

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.