Animated Banner with Google Web Design

Asked

Viewed 417 times

0

I created an animated banner using the Google Web Design tool. For those who have used it create the banner with HTML5 CSS and Javascript.

to embed this banner on my page I used the HTML tag:

            <div class="row">

              <iframe src="banner/rodrigo.html" width="305" height="255"></iframe>

            </div>

I was wondering if this is the right way to incorporate an animated banner into a website, or if there is another way, for example: Make google web design save as an SVG file something like.

html google

  • You say this based on the limitations that Google Web Design offers you or in general terms of development with HTML and CSS?

  • is pq had never done, an animated banner to put on a page, so when I did by default the GWD tool creates a page in html, and CSS and JS files. The only way I thought of incorporating this banner was to IFRAME, so I wanted to know if this is how I did it

1 answer

1


Addressing your issue in general terms of front-end development and leaving aside a little the possibilities of the Google Web Design tool.

There are several ways to include your page banner/Rodrigo.html, I say the attribute iframe is not the best option for this case as it is very limited. I rebound that iframe not necessarily wrong, only that it is not good practice.

If you are developing with PHP, dynamically it is possible to include your page as follows:

<?php include 'banner/rodrigo.html'; ?>

Practice inclusion with PHP at this link.

If you are only developing the design itself, no dynamic content, you can use Javascript as follows:

Include the tag <script> in <head> from your website, it will contain the file information to be included and the <div> that will be used.

<html> 
  <head> 
    <script src="jquery.js"></script> 
    <script> 
    $(function(){
      $("#include").load("banner/rodrigo.html"); 
    });
    </script> 
  </head> 

  <body> 
     <div id="include"></div>
  </body> 
</html>

Read more about inclusion via Javascript in this topic.

*Since Google Web Design should include jquery, you will not need the tag that makes the library call.

*Remember that I am not considering the contents of your file banner/rodrigo.html, your file .css, jquery conflicts, etc.

Browser other questions tagged html google

You are not signed in. Login or sign up in order to post.