Trädvy Permalänk
Medlem
Plats
Göteborg
Registrerad
Jun 2013

Hjälp med kod till webbsida

Hej!

Jag håller på att bygga en hemsida till vårt UF-företag men är nybörjare inom html etc. och behöver lite hjälp.

På vår Home-page har jag skapat en liten animation som visas medan sidan laddas, men jag vill inte att denna ska behöva komma upp om användaren kommer från en sida på vår hemsida, alltså trycker på länk till förstasidan. Jag har försökt att få fram domänen på den tidigare besökta sidan med "document.referrer" och liknande men utan att lyckas så därför ber jag er om hjälp.

Koden för animationen kommer nedan:

<div class="loader"></div> <style>.loader { position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 9999; background: url('http://bosonprotein.com/onewebmedia/Magiska%20Bollar.gif') 50% 50% no-repeat rgb(0,0,0); background-size: 10%; } </style> <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script> $(window).load(function() { setTimeout(function(){ $('.loader').fadeOut('slow', function () { }); },1000); }) </script>

Tack på förhand!

Trädvy Permalänk
Medlem
Plats
Sundsvall
Registrerad
Dec 2006

Är inte expert på jquery. Men varje gång sidan laddar kommer din kodsnutt ladda.
Det du behöver är troligen en cookie som håller reda på om man besökt sidan eller ej, och startar animationen därefter.

Så, läs på hur man hanterar cookies med jquery.

Canon 70D | 2x Dell Ultrasharp 24" | i7 3770k | 16B | GTX 780

Trädvy Permalänk
Medlem
Plats
Sverige
Registrerad
Jan 2002
Skrivet av ShaRaKuZz:

Hej!

Jag håller på att bygga en hemsida till vårt UF-företag men är nybörjare inom html etc. och behöver lite hjälp.

På vår Home-page har jag skapat en liten animation som visas medan sidan laddas, men jag vill inte att denna ska behöva komma upp om användaren kommer från en sida på vår hemsida, alltså trycker på länk till förstasidan. Jag har försökt att få fram domänen på den tidigare besökta sidan med "document.referrer" och liknande men utan att lyckas så därför ber jag er om hjälp.

Koden för animationen kommer nedan:
<div class="loader"></div>

<style>.loader {
position: fixed;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
z-index: 9999;
background: url('http://bosonprotein.com/onewebmedia/Magiska%20Bollar.gif') 50% 50% no-repeat rgb(0,0,0);
background-size: 10%;
}

</style>

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<script>
$(window).load(function() {
setTimeout(function(){
$('.loader').fadeOut('slow', function () {
});
},1000);
})
</script>

Tack på förhand!

Lägg till en koll på referrer-variabeln, om den kommer från en domän som inte är er egen så visas den.

<script> $(window).load(function() { if(document.referrer.split('/')[2] !== "bosonprotein.com"){ setTimeout(function(){ $('.loader').fadeOut('slow', function () { }); },1000); } }) </script>

//Zidde

Trädvy Permalänk
Medlem
Registrerad
Dec 2011

@ShaRaKuZz: Vad är egentligen syftet med animationen? Verkar som att ni bara döljer hela sidan i 1 sekund när den redan har laddat färdigt. Eventet "load" triggas ju just när elementet och dess subelement har laddat och ni kallar det på window-objektet.

Om ni hämtar data asynkront och vill visa en spinner eller likande är det bättre att dölja den när all data tagits emot, alltså i callbacken för .ajax() eller vad ni nu händelsevis använder.

Trädvy Permalänk
Medlem
Registrerad
Feb 2016

^ Säger som ovan, just nu verkar du bara fördröja sidan. Är det någonting som laddas på sidan eller har du animationen bara för "coolheten". Är det nr2, skippa animationen.

Trädvy Permalänk
Medlem
Plats
Landskrona
Registrerad
Nov 2008

Försök att inte ha mellanslag i filnamnen, exempelvis http://bosonprotein.com/oxygen%20blue.html och http://bosonprotein.com/onewebmedia/Magiska%20Bollar.gif

Ersätt mellanslag med _ eller - i filnamn för att snygga till adresserna.