[Løst] Hvordan lage en zoom funksjon ?

[Sssda1]

Hei,

 

På nettsiden min skal jeg ha en + og - knapp som zoomer inn og ut akkurat som ctrl+ og - og det gikk med denne koden:

var current = 100;
$("#zoomtest").click(function(){
current += 5;
$("body").css("zoom", ""+current+"%" );
})

 

Problemet er når jeg lenker meg videre på nettstedet zoomes det selvsagt tilbake til normalt igjen. Så det jeg lurer på er om jeg kan lagre dette så lenge brukeren er på siden, eller om det er noe annet jeg burde gjøre for å hjelpe med større / mindre skrift?

[grapz]

Hei,

 

Vel, du kan gjøre det på flere måter:

1. http://pablotron.org/?cid=1557 (PersistJS)

2. Lagre det som cookie

3. Har du noe dynamisk bak (f.eks PHP)? Da kan du jo sende med 'current' på linkene og så returnere ferdig skalert tekst

Endret 23. november 2012 av grapz

[Flugg]

Vil anbefale å bruke HTML5 local storage fremfor cookies, det er både kjappere og tryggere

 

http://diveintohtml5.info/storage.html

 

Hver gang brukeren trykker på knappene kan du oppdatere en variabel i local storage. Så setter du 'current' variablen til 'zoom' variablen hver gang siden blir lastet:

 

var current = localStorage["zoom"] || 100;
$("#zoomtest").click(function(){
  current += 5;
  $("body").css("zoom", ""+current+"%" );
  localStorage["zoom"] = current
})

Endret 24. november 2012 av Flugg

[Sssda1]

Takk, etter nye knoting gikk det sånn tålelig bra.

 

Det måtte imidlertid lagres ved

localStorage.zoom

og ikke

localStorage("zoom")

[Sssda1]

Takk, etter nye knoting gikk det sånn tålelig bra.

 

Det måtte imidlertid lagres ved

localStorage.zoom

og ikke

localStorage("zoom")

 

Nei, nå krøller det seg til igjen. Funksjonen lever sitt eget liv, kan noen se om det er noe galt i koden her? Den fungerer normalt på et par sider, så plutselig zoomer den inn 1000 ganger eller no, helt håpløst.

 

var current = sessionStorage.zoom  || 100;
$("body").css("zoom", ""+sessionStorage.zoom +"%" );

$("#zoomin").click(function(){
current += 10;
sessionStorage.zoom = current;
$("body").css("zoom", ""+sessionStorage.zoom+"%" );
});
$("#zoomut").click(function(){
current -= 10;
sessionStorage.zoom = current;
$("body").css("zoom", ""+sessionStorage.zoom+"%" );
});
$("#tilbakestill").click(function(){
current = 100;
sessionStorage.zoom = current;
$("body").css("zoom", ""+sessionStorage.zoom+"%" );
});

 

og her er siden

 

http://cube.iu.hio.no/~s188075/Nyt

[Emaxine]

Du har satt tråden din som løst. Mulig du får lettere svar om du setter den som uløst.

[baran]

Får en javascript runtime error på logg inn siden blant annet:

 

GET http://cube.iu.hio.no/~s188075/Nyt/index.css 404 (Not Found)

[grapz]

Har trykket meg gjennom 20 sider nå, men opplever ikke at den lever sitt eget liv.

 

Et par andre småting:

Når du har aktivert en av de 4 hovedboksene på fremsiden (Styrke, kondisjon osv), så burde det vist en lukkeknapp en plass.

Når du åpner 'kondisjon', så ser du at du har feil encoding på teksten. Kommer dette rett fra databasen?

[Sssda1]

Har trykket meg gjennom 20 sider nå, men opplever ikke at den lever sitt eget liv.

 

Et par andre småting:

Når du har aktivert en av de 4 hovedboksene på fremsiden (Styrke, kondisjon osv), så burde det vist en lukkeknapp en plass.

Når du åpner 'kondisjon', så ser du at du har feil encoding på teksten. Kommer dette rett fra databasen?

 

Jeg fikk ordnet det med zoom, det var sånn at når jeg trykka på zoom + og la til 5% så gikk det fra 100% til 1005% . rart det bare skjedde en gang i blandt men...

 

Ja det er en del jobb som står igjen så takker for input, det er ren html som popper opp så det er bare encodinga som gjør det Skal se om jeg klarer å lage lukke-knapp også, blir kanskje mer oversiktlig da.