2014-01-04 6 views
0

Я пытаюсь расположить анимацию JQuery красиво (ниже, по центру) на этой странице:Позиционирование JQuery/HTML скрипт на блоге Squarespace

http://www.edoardocroce.com/

Я использую фрагменты кода, которые я нашел здесь и там. Вы можете найти код, который я использую здесь ниже.

Любой может сказать мне, если это возможно без большой работы?

<!DOCTYPE html> 
<html> 
    <head> 
    <script type="text/javascript" src="//code.jquery.com/jquery-1.10.2.min.js"></script> 
    <script type="text/javascript" src="http://s3.amazonaws.com/codecademy-content/courses/hour-of-code/js/alphabet.js"></script> 
    </head> 
    <body> 
    <canvas id="myCanvas"></canvas> 
    <script type="text/javascript" src="http://s3.amazonaws.com/codecademy-content/courses/hour-of-code/js/bubbles.js"> 
    </script> 
    <script type="text/javascript"> 
var myName = "Edo's Blog"; 
var letterColors=[black,black,black]; 
if(10 < 9) { 
    bubbleShape = "circle"; 
} 
else { 
    bubbleShape = "square"; 
} 
drawName(myName, letterColors); 
bounceBubbles(); 
    </script> 
    </body> 
</html> 
+0

по внешнему виду, если вы хотите, чтобы он был центрирован, поместите '' inside '

' –

ответ

0

Просто добавьте стиль в #myCanvas или добавить элемент над ним с моделированием, как:

<div id="header"><canvas id="myCanvas"></canvas></div> 

и на вашем CSS:

#header { text-align: center; width: 100% } 
#myCanvas { margin-top: 100px } 

Это будет центр холста и опустите заголовок на 100 пикселей.

0

добавить CSS для центрирования и снизить холст ... например:

#myCanvas { 
    margin: 0 auto; /*to center*/ 
    margin-top: 80px; /*to lower*/ 
} 

В случае, если вы не знаете, CSS идет в голову, как этот

<head> 
    <style> 
    #myCanvas { 
     margin: 0 auto; /*to center*/ 
     margin-top: 80px; /*to lower*/ 
    } 
    </style> 
..... 
</head> 

или вы может ссылаться на внешний лист css, «правильный» способ сделать что-то.

 Смежные вопросы

  • Нет связанных вопросов^_^