Just nu i M3-nätverket
Gå till innehåll

Vissa element "hoppar runt" när sidan laddas..


ramo_and

Rekommendera Poster

Tjo!

 

På vår sida hoppar vissa element runt varje gång sidan laddas. Om jag t ex lägger till en klass på ett element med jQuery o så kör position relative på den klassen. I det elementet ligger sedan andra element som har position aboslute, top: 0px o left: 0px. Då laddas dom först längst upp till vänster sen hoppar dom snabbt på plats.

 

Jag antar att det beror på att klassen läggs till först då sidan laddats klart. Först hade jag det i en document.ready funktion o då fattar jag varför, men sen testade jag att lägga det i en vanlig jQuery funktion direkt efter element men de hjälpte inte.

 

Finns de nåt sätt att få det så dom inte hoppar runt när sidan laddas? Jag kan inte ändra i htmlkoden så därför måste jag göra såhär med jQuery....

 

Ni kan ju själva titta på www.portnordic.com

Länk till kommentar
Dela på andra webbplatser

men sen testade jag att lägga det i en vanlig jQuery funktion direkt efter element men de hjälpte inte.

Nä, det är inte korrekt väg att gå. Ready-hanteraren är där all element-manipulering skall ske (eller i metoder anropade därifrån).

Problemet ligger i din arkitektur. Varför använder du en klass i stilmallen och andra stilar så snart sidan laddats klart? Flytta dessa till stilmallen istället.

Använder du korrekt css ska du inte behöva manipulera positionering speciellt mycket efter laddning, det finns undantag förstås.

Ett alternativ är att gömma allt innehåll tills Ready-har kört klart.

Länk till kommentar
Dela på andra webbplatser

Nä, det är inte korrekt väg att gå. Ready-hanteraren är där all element-manipulering skall ske (eller i metoder anropade därifrån).

Problemet ligger i din arkitektur. Varför använder du en klass i stilmallen och andra stilar så snart sidan laddats klart? Flytta dessa till stilmallen istället.

Använder du korrekt css ska du inte behöva manipulera positionering speciellt mycket efter laddning, det finns undantag förstås.

 

Alltså jag kan inte påverka så mycket i hmtl-koden. Jag kan bara lägga till eget innehåll och inte ändra i den befintliga. Vi har byggt denna webshop på en färdig mall från ett företag som jobbar med webbshopslösningar. Och den är tyvärr baserad på tabeller där t ex position:relative inte funkar. Pga av det så har jag fått köra en div-wrap på en tabell o sätta postion relative på den, exempelvis på "topplistan" som ni kan se i högerspalten.

 

Ett alternativ är att gömma allt innehåll tills Ready-har kört klart.

 

Hur gör man det då? Blir inte sidan segare då?

Länk till kommentar
Dela på andra webbplatser

Hur gör man det då? Blir inte sidan segare då?

Inte segare, men sidan syns ju förstås inte förrän din jQuery kört klart. Men det är ju att föredra framför en synlig men hoppande sida.

Här får du då bryta mot den regel jag just satte upp och direkt efter body-taggen ändra dess display-stil till none.

Länk till kommentar
Dela på andra webbplatser

Inte segare, men sidan syns ju förstås inte förrän din jQuery kört klart. Men det är ju att föredra framför en synlig men hoppande sida.

Här får du då bryta mot den regel jag just satte upp och direkt efter body-taggen ändra dess display-stil till none.

 

Så typ köra display: none; på #templateArea som är "wrap-tabellen" på hela sidan o sen köra display: block på den i document.ready-funktion?

 

EDIT: De funkar fint förutom att slidern på förstasidan försvinner om man gör såhär. Vad kan det bero på?

Länk till kommentar
Dela på andra webbplatser

Det är lite svårt att hjälpa när du är begränsad i vad du kan göra.

Rent krasst - känn dig besegrad av ehandelssystemet eller byt. Det är inte speciellt lätt eller roligt att hacka i ett kasst uppbyggt system.

 

Sorry

Länk till kommentar
Dela på andra webbplatser

Det är lite svårt att hjälpa när du är begränsad i vad du kan göra.

Rent krasst - känn dig besegrad av ehandelssystemet eller byt. Det är inte speciellt lätt eller roligt att hacka i ett kasst uppbyggt system.

 

Sorry

 

Jo, jag förstår det. Det är rätt frustrerande att vara så begränsad också. Men nu är det tyvärr så och jag försöker göra det bästa av situationen. Att byta ehandelssystemet kommer inte att hända när vi har kommit såhär långt och dessutom har ett alternativ som är betydligt mer prisvärt om man jämför med andra ehandelssystem. Det enda som inte är så bra på detta är ju just designbiten då.

 

Detta skulle vara det sista jag behöver fixa rent designmässigt..

Länk till kommentar
Dela på andra webbplatser

Inte segare, men sidan syns ju förstås inte förrän din jQuery kört klart. Men det är ju att föredra framför en synlig men hoppande sida.

Här får du då bryta mot den regel jag just satte upp och direkt efter body-taggen ändra dess display-stil till none.

 

Jag har gjort som du sa och det funkar utmärkt i Firefox men inte så bra i Safari och inte alls bra i Internet Explorer... Det finns inget annat sätt eller?

 

Jag vet att jag är begränsad i och med den lösning vi har valt osv men detta är liksom det sista jag behöver fixa på shopen innan den blir helt klar så därför skulle de va lite gött att få ordning på det.

Länk till kommentar
Dela på andra webbplatser

Arkiverat

Det här ämnet är nu arkiverat och är stängt för ytterligare svar.

×
×
  • Skapa nytt...