Home » Javascript » Javascript not communicating when deployed but works in atom? [on hold]

Javascript not communicating when deployed but works in atom? [on hold]

Posted by: admin October 29, 2018 Leave a comment

Questions:

So on one of my pages for my portfolio website, the script to make the CSS grid responsive and work the way it does keeps separating different aspects into a stack as seen here: https://codepen.io/itsprogramcat/project/editor/XznKpK

<script src="http://code.jquery.com/jquery-3.3.1.js"></script>
<script src="scripts/jquery.diamonds.js"></script>
<script type="text/javascript">
  $(".diamondGrid").diamonds({
    size: 220, // Size of diamonds in pixels. Both width and height.
    gap: 5, // Pixels between each square.
    hideIncompleteRow: false, // Hide last row if there are not enough items to fill it completely.
    autoRedraw: true, // Auto redraw diamonds when it detects resizing.
    itemSelector: ".item" // the css selector to use to select diamonds-items.
  });
</script>

Go specifically to the project page.

But when I open and preview an item I don’t see any of those issues, I’m not sure if I am truly describing it right which is partly why I’m probably having an issue finding the answer without asking a question.

Is it possible my JS should be placed at the top?

Answers: