Convert Illustrator AI to HTML and ADD JAVASCRIPT

This is a quick introduction to creating a vector graphic in Adobe Illustrator (Illustrator AI), converting it to SVG and adding basic JavaScript interactivity to the SVG. It will help you if you have basic HTML knowledge.

[et_pb_section fb_built=”1″ _builder_version=”4.17.4″ _module_preset=”default” custom_padding=”0px||0px|||” global_colors_info=”{}”][et_pb_row _builder_version=”4.17.4″ _module_preset=”default” custom_padding=”38px|||||” global_colors_info=”{}”][et_pb_column type=”4_4″ _builder_version=”4.17.4″ _module_preset=”default” global_colors_info=”{}”][et_pb_divider color=”#86ADD3″ divider_weight=”3px” _builder_version=”4.17.4″ _module_preset=”default” custom_margin=”||5px|||” custom_padding=”0px||6px|||” hover_enabled=”0″ global_colors_info=”{}” sticky_enabled=”0″][/et_pb_divider][et_pb_text _builder_version=”4.17.4″ _module_preset=”default” text_font=”Source Sans Pro||||||||” text_text_color=”#0a0a0a” text_font_size=”20px” header_font=”Source Sans Pro|600|||||||” header_text_color=”#f84a2f” header_font_size=”38px” custom_margin=”||8px|||” global_colors_info=”{}”]

This is a quick introduction to creating a vector graphic in Adobe Illustrator (Illustrator AI), converting it to SVG and adding basic JavaScript interactivity to the SVG. It will help you if you have basic HTML knowledge.

[/et_pb_text][et_pb_text _builder_version=”4.17.4″ _module_preset=”default” text_font=”Source Sans Pro|600|||||||” text_text_color=”#f84a2f” text_font_size=”40px” text_orientation=”center” background_layout=”dark” min_height=”11.8px” custom_padding=”21px||24px|||” global_colors_info=”{}”]

Watch the video below

[/et_pb_text][/et_pb_column][/et_pb_row][/et_pb_section][et_pb_section fb_built=”1″ _builder_version=”4.17.4″ _module_preset=”default” custom_padding=”2px||2px|||” global_colors_info=”{}”][et_pb_row _builder_version=”4.17.4″ _module_preset=”default” custom_padding=”15px|||||” global_colors_info=”{}”][et_pb_column type=”4_4″ _builder_version=”4.17.4″ _module_preset=”default” global_colors_info=”{}”][et_pb_video src=”https://youtu.be/IZ7JTlxma04″ _builder_version=”4.17.4″ _module_preset=”default” global_colors_info=”{}”][/et_pb_video][/et_pb_column][/et_pb_row][/et_pb_section][et_pb_section fb_built=”1″ _builder_version=”4.17.4″ _module_preset=”default” custom_padding=”1px|||||” global_colors_info=”{}”][et_pb_row _builder_version=”4.17.4″ _module_preset=”default” custom_margin=”-1px|auto||auto||” global_colors_info=”{}”][et_pb_column type=”4_4″ _builder_version=”4.17.4″ _module_preset=”default” global_colors_info=”{}”][et_pb_text _builder_version=”4.17.4″ _module_preset=”default” text_font=”Source Sans Pro||||||||” text_text_color=”#0a0a0a” text_font_size=”20px” header_font=”Source Sans Pro|600|||||||” header_text_align=”center” header_text_color=”#27354d” header_font_size=”38px” header_line_height=”1.2em” global_colors_info=”{}”]

Expand your knowledge today, enroll in a Moodle course!

►► How to use Moodle 3.9 for teachers and course creators
https://ricoshae.com.au/moodle39teach

►► How to create responsive HTML and CSS in Moodle content
https://ricoshae.com.au/responsivecontentteach

►► How to create a plugin for Moodle using PHP
https://ricoshae.com.au/createapluginteach

►► How to create a child theme for Moodle
https://ricoshae.com.au/childthemeskill

►► How to create a block for Moodle
https://ricoshae.com.au/createablockteach

[/et_pb_text][/et_pb_column][/et_pb_row][/et_pb_section]