0

I've found canvas animation using jquery plugin on here

I want to display that animation plugin as background of a div element, i've found the answer on here but i'm still confused how to implement toDataURL() method with jquery.

Or is there any other way how to set some animation plugins as background of a div element?

Community
  • 1
  • 1
Jhonny Jr.
  • 363
  • 3
  • 4
  • 15

1 Answers1

1

Seems like neither of thoose requied what i wrote before. You just have to include the plugin and jquery library in the header like this:

<script src="//code.jquery.com/jquery-2.1.4.min.js"></script>

<script src="jparticle.jquery.min.js"></script>

Then call a jquery function on a container you want to run it:

$("body").jParticle({
});

If you wants to run it on a div instead of "body" just use "#id" on the function. Good luck :)

  • Please tell me if it's working :) – Simonyi János Oct 17 '15 at 21:17
  • Yeah it work, i was try that method before. But absolutely i want to make it work as background of a div element like the answer link i was mention above – Jhonny Jr. Oct 17 '15 at 21:23
  • I edited it to the final version. Pretty simple. :) First src is your jquery.js file, can be downloaded as well in your directory with html file. The second is the plugin. Then you have to call the function between tags. – Simonyi János Oct 17 '15 at 21:24
  • $("#div").jParticle({}); will create a canvas element inside #div. i want to make the canvas element as a background element of #div, not as standalone canvas element inside a #div – Jhonny Jr. Oct 17 '15 at 21:28
  • You still can use the first option then. Make to divs. First is the plugin with z-index: 1; The second is your content with z-index: 2; You have to put your div's id instead of "body". Both divs are on the same position by positioning it with css(position: absolute; margin: 0px; width: 100%; height:100%;) And put both div-s in a 3. one that has a size, so both divs gonna take the 3. div's size and position. – Simonyi János Oct 17 '15 at 21:32