Jump to content
php.lv forumi

repeat ar position


sega99

Recommended Posts

ir kādas alternatīvas netaisot 100px garu bildi?

 

vēlos lai izvēlētā krāsa

pwuxzd6ym21nhcdlqqp.png

būtu iespējami aizpildīt 50% no 100px

 

problēma ir tur ka ja ieliek repeat-x tad viņš aizpilda līdz 50% ar visu attēlu vairākas reizes ntajās krāsās nevis konkrēto apgabalu(krāsu) kas šajā gadijumā tiek izvēlēts violets ar background-position palīdzību

 

kods

http://paste.php.lv/32ad502447abb49a79b315c9ccdb7ac6/nonum

 

bilde ar kuru tiek strādāts

f8r90cc4nnbz28p45e1.png

Edited by sega99
Link to comment
Share on other sites

http://jsfiddle.net/k2bVZ/

 

HTML:

<div class="outer">
    <div class="inner" style="width:20%;"></div>
</div>

<div class="outer">
    <div class="inner" style="width:50%;"></div>
</div>

<div class="outer">
    <div class="inner" style="width:70%;"></div>
</div>

 

CSS:


.outer{
    width:200px;
    height:20px;
    border:1px solid #ccc;
    margin:4px;
}
.inner{
    height:100%;
    background:url(http://content.mycutegraphics.com/backgrounds/polkadot/polka-dot-background29.gif);
}

 

 

P.S.

Uzlabotais demo: http://jsfiddle.net/k2bVZ/1/

Edited by codez
Link to comment
Share on other sites

nee

 

piem.

 

 

<div style="background-color: #ffffff; box-shadow: 1px 1px 1px grey; width:100px;">
<div style="height: 10px;background: url('/image.png') repeat-x; background-position: -4px 1px; width: 50%;"></div>
</div>

 

taču repeat-x taisa pigorus, viņš pārzīmē visu attēlu pārzīmē nevis TIKAI TO DAĻU kas izvēlēta ar background-position

 

ar no-repeat parāda īsto attēlu bet man vajag tieši to background-position daļu repeatot

Edited by sega99
Link to comment
Share on other sites

Tādā gadijumā vienīgā iespēja ir to darit ar js.

1. variants - Izveidot daudz daudz blakus stāvošus html elementus, kuros bg ir uzlikts attiecīgais izgriezums

2. variants - uz canvas ciklā uzzimēt izgriezumu vairākas reizes.

3. ja runa ir par vienu krāsu, tad noteikt krāsu un ar js iestatīt bacgroundtu tādā krāsā.

 

 

P.S. Nice1 variants arī der, ja bildētē katru krāsu uztaisa tik augstu, cik augsts ir aizpildāmais laukums.

|

|

|

|

|

Edited by codez
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...