bullet move

[m-kafiyan]

alan man yek moshkele asasi daram yek safhe mikham tarahi konam mesle in http://hitmo-studio.com/cooperation.html

bad to durust kardane link hayei k rosh miri flesh ha micharkhe b samtesh yek moshkeli dashtam yani yeki k na chand ta inturi k man code ha ro neveshtam moshkeli avali k hast ine k vaghti hover mishe feleshi k kenare link ha miyad hast k halate animation dare o ba fasele azash harkat mikone man b vase inke dorost she dar halati k hover nashode left manfi dadam va bad vasash dar halate hover left 10 px o gozashtam o taransition ham behesh dadam ama durust nashud aslan nemidunam cheturi bayad benvisamesh k dorost bashe ba css

yek moshkele dg ham has inke to site asli yek tag a dar nazar gerefte dakhele li k vaghti hover mishe kolesh hover beshe va taghirati k to hover tarif mikone vase kole div haye dakhelesh etefagh biofte ama man b tag a ro kharej az li tarif kardam va az div vase dakhele li ha estefade kardam ama alan moshkeli k ba hoveresh daram ine k vaghti miram roye kole tag a hoveresh moshkel dare unam nemidunam chi karesh konam

code haye man k fek konam asasi moshkel dare https://github.com/m-kafiyan/prof-profile-

[sesameJar]

salam.man k ziad chizi nafhmiam amma mituni vase felesh haie kenare link in karo anjam bedi:

dar halate mamooli k kenare dive madare va ie opacity 0 besh midi.dar halate hover ham ie -webkit-transform: translate

besh midi.yadet nare k CSS3 va support IE besyar kam.

paragraphe 2om k aslan nafahmidam.

[m-kafiyan]

khub are un k opacity 0 dadam bhesh moghei k hover mishe opacityish 1 mishe transferm ham bhesh dadam ama commentesh kardam chun kar nemikard momkene age vaght dashtin code ham ro 1negah bndazin lotfan

age

[sesameJar]

salam.avalan k niaz nis az 3D tranlate estefade koni.

translate(x,y)

ama agar mikhai az 3Dish estefade koni bayad yadte bashe k translateX() x bayad capital bashe.shoma x(small) gozashtin

[Mrshcom]

hitmo ina ro ba SVG doros karde age vaght bezari va SVG yad begiri in kara bahash kheili rahat tare va mitoni karaye jaleb tari ham doros koni!!

[m-kafiyan]

@mkdesign yani dalile moshkelesh in bud????

@Mrshcom are midunam ba svg neveshte ama baraye svg bayad xml ro yad dashte bashim va baraye xml bayad kami java yad dashte bashim albate in chizi bud k man to w3school khundam ama bayad ino tahvil bedam ta 10 azar ziyad vaght vase khundan svg nadaram ama montazeram vaghtam kami azad tar beshe k bekhnumesh

[Mrshcom]

@m-kafiyan na xml chize khasi nadare!! nigah xml rabti be javascript nadare! age bekhay svg ro control koni va effect bedi bayad ba javascript benvisi! vagarna kar ba svg dar halate mamoli lozomi be donestane js nadare!! svg ro to 3-4 rooz mitoni khob yad begiri!!

[m-kafiyan]

@Mrshcom vaghean alan vaghte svg o nadaram yani hange hangam 2 ta proje hast k yekishu hafte dg bayad tahvil bedim yekisham 10 azar tarahi site ham hast va man alan to hamin gir kardam ,dars haye uni ham hast

nemidunam ama vaghte azad age kami bishtar midashtam hatman vaght mizashtam rush felan k @mkdesign chizi k goftano emal kardam ama bazam nashud !!!

[sesameJar]

ba safe arayit inghad moshkel daram k had nadare.

in code haro ie nega bezan lotfan. taghiratie k tush dadam:

<a class="cover" href="#">  
    <li class="cover list1">
        <div class="item1">
            <span class="bullet"></span>
                <div class="list1item1">
                    <h4 class="item1text">my complete biography!</h4>
                </div>
        </div>
            <p>small expelaination about yourself + readmore... </p>

    </li>
</a>

agar deghat karde bashi span.bullet ro montaghel kardam tuie oon dive.chera? chon k khob tage a va tage li kheili bozorgan va vaghty hover shan hamchin hal nemide.yani dorostesh ine k vaghty ru oon dive raft biad amma zoodtar miad va zeshtesh mikone.

CSS kolli moshkel dare hamin ghesmat k lotfan negah kon

div.hollinks ol a span.bullet{
        z-index             : 20;
        width               : 20px;
        height              : 19px;
        position            : absolute;
        top                 : 20px;
        background          : url('images/sprites-set-2.png');
        opacity             : 0;
        transition:all 500ms;
        -moz-transition:all 500ms; /* Firefox 4 */
        -webkit-transition:all 500ms; /* Safari and Chrome */
        -o-transition:all 500ms; /* Opera */
    }
    div.hollinks ol a div.item1:hover span.bullet{
        opacity: 1;
        display: block;
        transform:translate(10px,0px);
        -webkit-transform:translate(10px,0px); /* Safari and Chrome */
    }

---

az dars khundan andakhti mano :D noghte zafe man hamine :D amma hal dad :D

[sesameJar]

@m-kafiyan chera b hover transition dadi dar hali k site asli dar har 2 halat transiotn daran.vaght b hover transition bedi vaghty bargarde animation migire.

in alan iekam mizun nis.khodet mizunesh kon.

dalil inke translatesh kar nemiard in bud k shoma display none dade budi.

niazi b in kar nis vaghty opacity 0 dadi.

[m-kafiyan]

@mkdesign khub alan yek moshkeli hast aval inke man display none ro ham bardashtam ama hamchenan translatesh kar nemikone :| dar natije transition ham k kar bokone ham to hover va ham dar halate bedune hoveresh fek mionam k dide beshe !!!! aslan nemidunam chera kar nemikone :(

man khudam ham az dars oftadam ama az dars oftadane shuma maghtaeeye ghato vasl mishe ama male man hamchenan az avale term edame dare :D

[sesameJar]

:)))) nazar begam moadele terme pisham az bas k HTML kar kardam chand shod :D emtehane payan term HTML tu barge neveshtam 10 shomam :D fk kon...

@m-kafiyan hamun code haie k dadamo jaigozin kon.kar mikone.vase man k dare kar mikone.monteha ziad daghigh nist bayad andaze haro dast kari koni.

[m-kafiyan]

@mkdesign alan transiton ro ham b div.hollinks ol a div.item1:hover span.bullet bedam dg na???

na dorost kar nemikone !!! alan check kardamesh

ehtemalan ozay manam hamine diruz dashtam az to class jolo cheshme ostadam to git issue mizashtam :D vaghean khuda bekheyr begzarune in termu

[sesameJar]

transition ziad mohem nis.daghighan code haie khodeto pak kon va oonaie k bet dadamo bezar. :D

[m-kafiyan]

daghighan neveshtameshun ba hamin dastam alan b june khudam :D

[sesameJar]

commit kardi???? ru git hast?

[m-kafiyan]

savesh nakardam chand min w8 :D

[m-kafiyan]

are gozashtamesh alan !!!

[sesameJar]

inke code haie man nit

ino

div.hollinks ol a div.item1:hover span.bullet

jaygozine in kon bebin etefaghi miofte

div.hollinks ol a:hover span

[m-kafiyan]

@mkdesign na moshkel az un nabud, fahmidam moshkelesh chi bud dorost shud 1 bideghatiye tablo karde budam :D

khayeli mamnun lotf kardin ....:) bebkhshid az dars ham endakhtametun vase tanavo ama khub bud say mikonam bazam az in tanavo ha behetun bedam vasate dars :)

[sesameJar]

push kon bebinam

:))) shukhi kardam.man kollan darse daneshgaho vel kardam.in mohem tare ;) va manam jedam asheghe inam k ru proje haie baghie kar konam.kolli chiz bare adam mishe

[m-kafiyan]

push kardam transform:translate(10px,0px); bayad minveshtam ama neveshte budam transform:translateX(10px,0px)

mohemtaro k nazari nadaram ama man yeki k vaghti code minvisam taze hamin html o css k hichi nist nesbat b js o php va etc zugh mikonam kolan khushhal tar misham ta zamani k to uni vaghtamu talafe fahmidane harfhaye ostad nime mohtaram mishe =)