Jump to content

SUBIECTE NOI
« 1 / 5 »
RSS
Info Coronavirus/Vaccinare vs Fake News

probleme mașina de spalat rufe

Magazine care vand bere la keg

Proiect ciudat legat de metaverse...
 Daniel Fenechiu: Nu vom aște...

Transfer in acelasi pc cu FTP

Și daca industria europeana ...

Alimentare camera ip distanta 50m
 Nelamurire instalare internet

Cheie licenta Windows11

Sfat plantare arbori pentru o mic...

rachiu din gemuri si dulceturi
 Bara de cautare sa o mut jos?

Accesorii multitool Black and Dec...

Suma maxima.

Pilonul II - date de piata, tendi...
 

Html imagini lag, cand se face scroll

- - - - -
  • Please log in to reply
5 replies to this topic

#1
bystefu

bystefu

    Junior Member

  • Grup: Members
  • Posts: 112
  • Înscris: 26.11.2014
Salut, am incercat de mai multe ori sa fac un template,cu niste imagini pe coloane. Un width de 980px sau chiar 1100, si o serie de imagini cu un aprox. width=180 & height=220.

Afisate una langa cealalta, frumos, stiti la ce ma refer. Ideea este ca ele sunt putin mai mari de rezolutia la care le afisez eu, cu o idee. Am luat modelul de la un site, insa la el e in regula, ceea ce la mine nu. Vreau sa zic ca, avand in vedere ca am imagini mai putine decat ale lui, atunci cand fac un scroll jos-sus, imaginile parca s-ar distorsiona. Parca s-ar alungi si s-ar reface, un fel de lag.

Am salvat pagina, n-are mai mult de 500kb, am validat cu W3, totul e in regula. E pe platforma wordpress + bootstrap, fara alte teme , pluginuri,scripturi,etc.. care ar putea dauna.

Pagina html incepe astfel:

<!DOCTYPE html>
<html lang="en">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<head>
<title><?php wp_title( '|', true, 'right' ); ?></title>
	<?php wp_head(); ?>
   
</head>
<body>

Am facut si testul de viteza,se incarca ok, in maxim 0,80 de secunde. Nu stiu unde gresesc, css-ul sta cam asa:

.item
{
	position:relative;
	float:left;
	width:140px;
	height:200px;
	overflow: hidden;
	margin-right:10px;
	margin-bottom:15px;
}
.item img
{
	width:140px;
	height:200px;
}

Am incercat si cu display-inline, position:relative, etc.. nu s-a schimbat nimic.Iar imaginile le afisez standard <img src="">
Pc-ul n-are cum sa aiba probleme,deoarece am incercat si dupa laptop, unde la ambele am i3,respectiv i5 cu 1 si 2gb Ram.

Aveti vreo idee ce se intampla?Mentionez ca nu e prima data cand am astfel de probleme.
Poate trebuie alfel afisate, sau css-ul nu e bine gandit, ori trebuie adaugat ceva in head... MS !

#2
159

159

    Senior Member

  • Grup: Senior Members
  • Posts: 2,609
  • Înscris: 22.05.2016
La fel se intampla si pe Firefox?

#3
bystefu

bystefu

    Junior Member

  • Grup: Members
  • Posts: 112
  • Înscris: 26.11.2014
da, si nu am background fixed sau altceva....

#4
maxtron_69

maxtron_69

    Senior Member

  • Grup: Senior Members
  • Posts: 2,534
  • Înscris: 18.08.2010
Price problema de HTML/CSS trebuie postata ca un http://jsfiddle.com ca sa poata fi rezolvata

Ai un link la site/pagina?

E greu de lamurit din ce ai pus tu acolo, bootstrap are CSS ul lui, trebuie vazut ce si cum.

Oricum, parerea mea ca aii pornit prost folosind px pt dimensiunea imaginilor.
Procente pe containere si imaginile responsive inauntrul lor.

Edited by maxtron_69, 03 August 2016 - 23:25.


#5
bystefu

bystefu

    Junior Member

  • Grup: Members
  • Posts: 112
  • Înscris: 26.11.2014
Multumesc., s-ar putea...Okay, as putea face width=10% , sau ceva de genul, dar cum i proportionez height-ul ? Tot in procente...,eventual acolo sa folosesc un max-height? :)

#6
maxtron_69

maxtron_69

    Senior Member

  • Grup: Senior Members
  • Posts: 2,534
  • Înscris: 18.08.2010

View Postbystefu, on 04 august 2016 - 10:12, said:

Multumesc., s-ar putea...Okay, as putea face width=10% , sau ceva de genul, dar cum i proportionez height-ul ? Tot in procente...,eventual acolo sa folosesc un max-height? Posted Image
Ti-am zis ca ti se va rezolva problema daca pui link catre site sau pui codul intr-un fiddle.
Pt imagini responsive ca prin magie:
img { height: auto; max-width: 100%; }


Si apoi faci o succesiune de div uri care au ce dimensiune vrei tu, 10% etc

Anunturi

Neurochirurgie minim invazivă Neurochirurgie minim invazivă

"Primum non nocere" este ideea ce a deschis drumul medicinei spre minim invaziv.

Avansul tehnologic extraordinar din ultimele decenii a permis dezvoltarea tuturor domeniilor medicinei. Microscopul operator, neuronavigația, tehnicile anestezice avansate permit intervenții chirurgicale tot mai precise, tot mai sigure. Neurochirurgia minim invazivă, sau prin "gaura cheii", oferă pacienților posibilitatea de a se opera cu riscuri minime, fie ele neurologice, infecțioase, medicale sau estetice.

www.neurohope.ro

0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

Forumul Softpedia foloseste "cookies" pentru a imbunatati experienta utilizatorilor Accept
Pentru detalii si optiuni legate de cookies si datele personale, consultati Politica de utilizare cookies si Politica de confidentialitate