Johan Westborg Johan Westborg - 1 year ago 58
CSS Question

Javascript won't work with the html

So i'm having a problem here, when i'm using jsbin it all works fine with the javascript, html and the css where they all manage to work together. But since it's better and easier to work in brackets or sublime text 2 i tried to use them. And first i couldn't get the javascript to work together with the html even though i connected them both correctly. I even tried putting all the javascript code inside a script tag in the html as you can see here:

<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>

<link rel="stylesheet" type="text/css" href="css1.css">

<body background="">
<img id="fiskespo" src ="">
<p id="klocka"></p>

<script> = 'none'; // tar bort muspekaren
(document).mousemove(function (e) { //gör en funktion för musen
('#fiskespo').offset({ // tar fram bilden
left: e.pageX + -190, //positonerar musen på bilden
top: e.pageY + -110//positonerar musen på bilden

var b = 1;
for (var i= 0; i<5;i++){ // skapar en loop som skriver ut 5 stycken bilder på fiskar
function getRandomPosition(element) {
var x = document.body.offsetHeight-element.clientHeight;
var y = document.body.offsetWidth-element.clientWidth;
var randomX = Math.floor(Math.random()*x);
var randomY = Math.floor(Math.random()*y);

return [randomX,randomY];
function fisk(skala) {

var img = document.createElement('img');
img.setAttribute("style", "position:fixed;");//positionerar dom
img.setAttribute("src", ""); // tar fram bilderna
var xy = getRandomPosition(img); // ger xy random position = xy[0] + 'px';// gör att de ej kan flyttas från ruta 1 = xy[1] + 'px';
$(img).click(function(){ $(this).remove();}); //skapar en onclick funktion som gör så att om man klickar på bilden försvinner den

myTimer = setInterval(myCounter, 1000); //bestämmer hur lång tiden ska vara (1000 = 1 vanlig sekund)
var seconds = 0; //sekunden den börjar på
function myCounter() {
document.getElementById("klocka").innerHTML = ++seconds; //räknar klockan i sekunder

And this didn't work either. And i find this really wierd since it works on jsbin but not on a better program. Anybody have a clue on what i might be missing or if there is problems with the programs i'm using. Here is the css code aswell if you want to take a look at it all together.

width: 120px;
z-index: 2;


background-size: 100%;


font-size: 60px;
font-family: cursive;
color: red;
z-index: 3;


font-size: 40px;
position: relative;
top: -260px;
z-index: 3;



Answer Source

You need to include jQuery in your page and also use $ here:

$(document).mousemove(function (e) { ... });
$('#fiskespo').offset({ ... });