Перейти к содержимому

Фотография
- - - - -

Не работает скрипт


  • Вы не можете создать новую тему
  • Авторизуйтесь для ответа в теме
Сообщений в теме: 35

#1 serhiokravadnr

serhiokravadnr

    Прохожий

    Топикстартер
  • Участник
  • 0
    35 сообщ.

Отправлено 28 Октябрь 2018 в 22:29

Уважаемые знатоки - подскажите, пожалуйста, почему не работают скрипты на сайте?

Хочу поставить этот скрипт - пример - что уже с ним не делал - не работает.

HTML код - вставлял и в страницу, и в header.php

<div id="container">
<div id="c-container">
<canvas id="c">Sorry.</canvas>
</div>
<div id="c2-container">
<canvas id="c2">Sorry.</canvas>
</div>

</div>

CSS код - то же самое - и в страницу, и в header.php -

<style type="text/css"> 
@import 'https://fonts.googleapis.com/css?family=Lato:100,100i,300,300i,400,400i,700,700 i,900,900i';

body,
html {
margin: 0;
padding: 0;
font-family: 'Lato', sans-serif;
background-color: black;
overflow: hidden;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
li {
margin: 0;
padding: 0;
}

#container {
width: 100vw;
height: 100vh;
position: relative;
float: left;
opacity: 0;
}

#c-container,
#c2-container {
width: 100vw;
height: 80vh;
position: absolute;
top: 0;
left: 0;
}

canvas {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
</style> 

JS код - то же самое - и в страницу, и в footer.php -

<script type='text/javascript> 
$(window).bind('load', function () {
const raf = function (entry) {
window.requestAnimationFrame(entry);
};
const random = function (min, max) {
max = max + 1;
return Math.floor(Math.random() * (max - min) + min);
}
var app = {
init: function () {
this.cacheDOM();
this.style();
},
cacheDOM: function () {
this.container = $('#container');
this.images = $('img');

this.mouseX = null;
this.mouseY = null;
},
style: function () {
this.images.imagesLoaded(function () {
$(window).resize(function initial() {
TweenMax.set(app.container, {
opacity: 1
});
return initial;
}());
});
},
cursorEvents: function (e) {
app.mouseX = e.clientX;
app.mouseY = e.clientY;
}
}

app.init();

var cContainer = $('#c-container'),
c = document.getElementById('c'),
c2Container = $('#c2-container'),
c2 = document.getElementById('c2'),
cx = c.getContext('2d'),
c2x = c2.getContext('2d'),
particleIndex = 0,
particles = {},
particleNum = 1,
particlesLoaded = false,
Particle,
Particle2,
canvas,
canvas2;

c.width = $('#c').outerWidth();
c.height = $('#c').outerHeight();

c2.width = $('#c2').outerWidth();
c2.height = $('#c2').outerHeight();

//INITIAL CANVAS DRAW
cx.fillStyle = 'rgba(0,0,0,1)';
cx.fillRect(0, 0, c.width, c.height);
c2x.fillStyle = 'rgba(0,0,0,1)';
c2x.fillRect(0, 0, c2.width, c2.height);

function particleFactory(thisCanvas, thisContext, thisParticleName, thisCanvasFunction) {

var particleIndex = 0,
particles = {},
particleNum = 2,
particlesLoaded = false;

thisParticleName = function () {
this.r = 8;
this.rStart = this.r;
this.rIncrement = this.r * -0.01;
this.x = thisCanvas.width / 2;
this.y = thisCanvas.height / 2;

this.vxIsNegative = random(1,2);

this.originTriggered = false;
this.vx = this.vxIsNegative === 1 ? random(0,50) * -0.1 : random(0,50) * 0.1;
this.vxMult = random(10,20) * 0.1;
this.vy = random(-10, 10);
this.vyMult = random(2,6) * -0.1;
this.opacityLimit = 1;
this.opacity = 1;
this.opacityIncrement = 0.05;
this.opacityReversing = false;
this.gravity = 1;
this.framerate = 0;
this.framerateCounter = this.framerate;
this.counter = 0;
particleIndex++;
particles[particleIndex] = this;
this.id = particleIndex;
this.life = 0;
this.maxLife = random(0, 100);
this.hue = random(30, 60);
this.light = random(50, 100);
this.color = `hsla(${this.hue},100%,${this.light}%,${this.opaci ty})`;

this.bounced = false;

this.duration = 60;
this.durationTotal = this.duration + this.opacityLimit * 10;
this.durationCounter = 0;
}

thisParticleName.prototype.draw = function () {

if ((!this.originTriggered) && (app.mouseX != null)) {
this.originTriggered = true;
this.x = app.mouseX;
this.y = app.mouseY;
}
this.color = `hsla(${this.hue},100%,${this.light}%,${this.opaci ty})`;
thisContext.fillStyle = this.color;
thisContext.beginPath();
thisContext.arc(this.x, this.y, this.r, 0, 2 * Math.PI);
thisContext.fill();

//START DRAW OPERATION
this.r += this.rIncrement;
this.x += this.vx;
this.y += this.vy;
this.durationCounter++;
if (this.vx === 0) {
this.vx++;
}
if (this.vxIsNegative === 1) {
this.vx
}
if (this.vy === 0) {
this.vy++;
}
if (this.y > thisCanvas.height - this.rStart) {
if (!this.bounced) {
this.vx *= this.vxMult;
} else {
this.vx *= 0.9;
}
this.bounced = true;
this.vy *= this.vyMult;
this.y = thisCanvas.height - this.rStart;
}
this.vy += this.gravity;
if ((this.r <= 0)) {
delete particles[this.id];
}
this.life++;
//END DRAW OPERATION
}

thisCanvasFunction = function () {
thisContext.globalCompositeOperation = 'source-over';
thisContext.fillStyle = 'rgba(0,0,0,1)';
thisContext.fillRect(0, 0, thisCanvas.width, thisCanvas.height);
if (!particlesLoaded) {
for (var i = 0; i < particleNum; i++) {
new thisParticleName();
}
}
thisContext.globalCompositeOperation = 'lighter';
for (var i in particles) {
particles[i].draw();
}
}
setInterval(thisCanvasFunction, 15);
}

$(window).resize(function initial() {
window.addEventListener('mousemove', app.cursorEvents, false);

c.width = $('#c').outerWidth();
c.height = $('#c').outerHeight();

c2.width = $('#c2').outerWidth();
c2.height = $('#c2').outerHeight();

return initial;
}());

particleFactory(c, cx, Particle, canvas);
particleFactory(c2, c2x, Particle2, canvas2);

TweenMax.set(c2Container, {
transformOrigin: 'center bottom',
scaleY: -1,
opacity: 1
});

TweenMax.set(c2, {
filter: 'blur(10px)'
});
});
</script>

Подключил 

<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.19.0/TimelineMax.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.19.0/TweenMax.min.js"></script>
<script src="https://code.jquery.com/jquery-2.2.4.js"></script>
<script src="https://npmcdn.com/babel-core@5.8.38/browser.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.imagesloaded/4.1.1/imagesloaded.pkgd.min.js"></script>

Ничего не помогает. Что я делаю не так?


  • 0

Спонсор

#2 BaNru

BaNru

    Пацифизжу

  • суперМодератор
  • 1016
    3 712 сообщ.

Отправлено 29 Октябрь 2018 в 12:12

Надо смотреть в консоли браузера, там должны быть ошибки показаны.


  • 0

#3 serhiokravadnr

serhiokravadnr

    Прохожий

    Топикстартер
  • Участник
  • 0
    35 сообщ.

Отправлено 30 Октябрь 2018 в 19:22

ошибок нет - предупреждения есть. На некоторых сайтах, просматривая код, показывает по 5-7 ошибок - и всё работает, а тут вот ....


  • 0

#4 BaNru

BaNru

    Пацифизжу

  • суперМодератор
  • 1016
    3 712 сообщ.

Отправлено 31 Октябрь 2018 в 05:51

Сложно гадать на приведённом коде из примера.

Выкладывай на хостинг свои файлы, там и будем смотреть.


  • 0

#5 serhiokravadnr

serhiokravadnr

    Прохожий

    Топикстартер
  • Участник
  • 0
    35 сообщ.

Отправлено 01 Ноябрь 2018 в 06:45

Прикрепленный файл  footer.php   12,58К   5 Количество загрузок:

attachment=3047:content.php]

Прикрепленный файл  header (1).php   1,2К   3 Количество загрузок:

Прикрепленный файл  page.php   116байт   3 Количество загрузок:

Прикрепленные файлы

  • Прикрепленный файл  content.php   1,62К   3 Количество загрузок:

Сообщение отредактировал serhiokravadnr: 01 Ноябрь 2018 в 06:47

  • 0

#6 BaNru

BaNru

    Пацифизжу

  • суперМодератор
  • 1016
    3 712 сообщ.

Отправлено 01 Ноябрь 2018 в 08:01

Это не поможет. Нам эти файлы не запустить.

Выкладывай в онлайн, где можно посмотреть сгенерированный код.


  • 0

#7 serhiokravadnr

serhiokravadnr

    Прохожий

    Топикстартер
  • Участник
  • 0
    35 сообщ.

Отправлено 01 Ноябрь 2018 в 19:56

Как я понимаю - это ссылка на сайт, где установлен код?

 

Это тестовый сайт - на рабочем боюсь пока пробовать. Тема и всё остальное - как на рабочем сайте

 

http://test.mastervdnr.pp.ua/


не пойму - на сайте вот это - и больше ничего - и ничего не работает

Прикрепленные изображения

  • Снимок.PNG

  • 0

#8 BaNru

BaNru

    Пацифизжу

  • суперМодератор
  • 1016
    3 712 сообщ.

Отправлено 02 Ноябрь 2018 в 08:45

1) Там у тебя подключается hueman/assets/front/js/scripts.min.js, он вызывает ошибку.
2) Так уже подключатся jQuery, второй раз подключать не надо. Правда там устаревшая версия, поэтому либо её надо обновить, либо отключить. Хотя это, вроде, не должно вызывать конфликтов.
  • 0

#9 serhiokravadnr

serhiokravadnr

    Прохожий

    Топикстартер
  • Участник
  • 0
    35 сообщ.

Отправлено 02 Ноябрь 2018 в 19:08

А можно определить, что именно в этом файле вызывает ошибку?

 

Файл в архиве

 

Лучше обычный , чем мин

Прикрепленные файлы

  • Прикрепленный файл  scripts.min.rar   23,59К   6 Количество загрузок:
  • Прикрепленный файл  scripts.rar   34,04К   2 Количество загрузок:

Сообщение отредактировал serhiokravadnr: 02 Ноябрь 2018 в 19:12

  • 0

#10 BaNru

BaNru

    Пацифизжу

  • суперМодератор
  • 1016
    3 712 сообщ.

Отправлено 02 Ноябрь 2018 в 19:18

В консоли браузера всё написано

Uncaught TypeError: Cannot read property 'clientHeight' of undefined at f

Но так как файл минифицирован - точно место найти проблематично.
Ругается, что не может найти clientHeight у какого-то элемента, потому что этого элемента на странице, скорее всего, нет.

Обычно рядом разработчики размещают не минифицированный файл. Надо его подключить вместо минифицированного и тогда можно будет посмотреть.
Либо можно самому "разминифицировать" через любой онлайн сервис: в гугле "js beautiful online" и выбираем понравившийся.
  • 0

#11 serhiokravadnr

serhiokravadnr

    Прохожий

    Топикстартер
  • Участник
  • 0
    35 сообщ.

Отправлено 03 Ноябрь 2018 в 20:12

Я так и сделал - скинул сначала мин файл, потом нашёл обычный (без мин) и скинул его следом

 


Ещё такой вопрос:

 

Почему он ругается, что не может найти clientHeight у какого-то элемента? До того, как был вставлен код - всё было хорошо - значит этот код куда-то дел этот clientHeight?

Прикрепленные файлы

  • Прикрепленный файл  scripts.rar   34,04К   0 Количество загрузок:

  • 0

#12 BaNru

BaNru

    Пацифизжу

  • суперМодератор
  • 1016
    3 712 сообщ.

Отправлено 03 Ноябрь 2018 в 20:21

Ещё раз: прикреплённые файлы ничего не дадут, всё надо смотреть онлайн.
Сейчас же это выглядит: "у меня машина не едет, вот посмотрите колесо".
На том сайте надо подключать нормальною версию, а не min и потом уже смотреть.
  • 0

#13 serhiokravadnr

serhiokravadnr

    Прохожий

    Топикстартер
  • Участник
  • 0
    35 сообщ.

Отправлено 03 Ноябрь 2018 в 20:36

А где его нужно подключать? Не могу найти это место


  • 0

#14 BaNru

BaNru

    Пацифизжу

  • суперМодератор
  • 1016
    3 712 сообщ.

Отправлено 03 Ноябрь 2018 в 21:24

Где-то в папке с темой.
Скорее всего в файле header.php, либо functions.php.
Рекомендую освоить "поиск текста по файлам".
  • 0

#15 serhiokravadnr

serhiokravadnr

    Прохожий

    Топикстартер
  • Участник
  • 0
    35 сообщ.

Отправлено 03 Ноябрь 2018 в 21:35

В Нотепад++ - я уже давно освоил - он его там не находит. 

 

Попробовал чуток по-другому вставить коды - страница нормально работает - ошибок не выдаёт - но по идее сам скрипт не работает - когда открываю его в файловом менеджере на хостинге - первый скрипт - красный, а закрывающий - жёлтый. 


  • 0

#16 BaNru

BaNru

    Пацифизжу

  • суперМодератор
  • 1016
    3 712 сообщ.

Отправлено 03 Ноябрь 2018 в 21:39

"поиск текста по файлам"

Что гугл рекомендует по такому запросу?


  • 0

#17 serhiokravadnr

serhiokravadnr

    Прохожий

    Топикстартер
  • Участник
  • 0
    35 сообщ.

Отправлено 03 Ноябрь 2018 в 21:45

Теперь понял - а можно где-нибудь или как-нибудь проверить - рабочий скрипт или нет? 

 

Здесь он работает https://codepen.io/w...en89/pen/gwvVpP - а у меня - по идее нет.

 

Я правильно понимаю на счёт цвета? У рабочего скрипта должны быть все красные script?


  • 0

#18 BaNru

BaNru

    Пацифизжу

  • суперМодератор
  • 1016
    3 712 сообщ.

Отправлено 03 Ноябрь 2018 в 21:58

Без понятия что там показывает файловый менеджер на хостинге. Может и погоду на Марсе.

Смотреть надо в консоли браузера.


  • 0

#19 serhiokravadnr

serhiokravadnr

    Прохожий

    Топикстартер
  • Участник
  • 0
    35 сообщ.

Отправлено 03 Ноябрь 2018 в 22:14

проверял только что скрипт весь на http://jsfiddle.net/ - он тоже не работает - чёрный экран и всё

 

Пора наверное закрывать эту тему - ничего не получается


  • 0

#20 BaNru

BaNru

    Пацифизжу

  • суперМодератор
  • 1016
    3 712 сообщ.

Отправлено 03 Ноябрь 2018 в 22:33

Если продолжать гнуть свою лень и не пытаться делать что говорят, то да - шансов нет.


  • 0



Похожие темы Свернуть

  Название темы Форум Автор Статистика Последнее сообщение
Статистика

Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 скрытых пользователей