C8 W2 S3

[AliMD]

Subjects

• Diffrent transition in hover
• Boxshadow inset animate
• CSS Transform
• Menu Structure

  Students Level

  1. Mohammad Sedaghat @sedaghat :top: (aslan ki jorat dare magham ozma ro mored sanjesh gharar bede)
  2. Ehsan Shadmehri @ehsansh :ok_hand:
  3. Sayed Reza Mahmoodian @mahmoodian :ok_hand: (ba farze inke hame kare khodet bashe)
  4. Mahdi Ghayoor @mghayour :ok_hand:
  5. S Hossein Behkamal @hoseinBL :ok_hand:
  6. Ali Ebrahimi @lastshepherd :+1:
  7. Mahdi Jannatian @mahdi-jannatian :-1: (ehsas mikonam az mabahes class kami aghabi lotfan sari be jobran)
  8. Sayed Amin Akbarzadeh @akbarzadeamin :-1:
  9. AmirReza Derayati @albertreza :-1: (Absent:exclamation:)
  10. Mohammad Hassan Kohansal @SingularDesigner :-1: (Absent:exclamation::exclamation:)
  11. S Mahdi Qooryani @qooryani :-1: (Absent:exclamation:)

      Top Home Works

  12. mghayour
  13. hoseinbl (harchand komak dashti !)
  14. lastshepherd

deghat konin ke faghat zaher mohem nist, vagarda in kar https://github.com/AliMD/1Tuts/issues/443#issuecomment-20766751 top mishod

Home Work

pish motale.e in link va sakht yek menu be hamrah sub-menu https://github.com/AliMD/1Tuts-CSS-Menu-in-Depth/tree/master/01%20Pure%20CSS%20Submenu

[AliMD]

transition mitoone be hover ham dade besh masalan ba zaman motefavet http://jsbin.com/ohagoc/1/edit

[AliMD]

box-shadow animate tips : http://jsbin.com/ohagoc/1/edit

[albertreza]

salam ostad man halam khob nabod natonestam biam . mishe bahso az inja 2nbal konam? albate daram 2nbal mikonam.

[AliMD]

CSS Transform

• Rotate : http://jsbin.com/owafob/5/edit
• Scale ; http://jsbin.com/owafob/2/edit
• Skew ; http://jsbin.com/owafob/3/edit
• Origin : http://jsbin.com/owafob/7/edit
• More : Mozilla Webplatform W3schools

[AliMD]

@albertreza gheybataro ke khordi vali haminja soalato bepors

[albertreza]

scale(3,1.5); skew(30deg, 20deg) in adad che mafhomi daran???????????

[AliMD]

@albertreza too in tamrin http://jsbin.com/ehojed/5/edit

1. li chera display:block dare ?
2. line 35 space ghable px ezafiye
3. line 27 ye space ezafe dari :D
4. line 15 bayad margin bash ! kolli sare class noch noch kardim be code hat :D

[albertreza]

@AliMD man k goftam vase das garmie . shoma ino molaheze konin on vakhte k estedad daronimo mibinin. http://jsbin.com/edowah/1.

[AliMD]

Follow these persons @chriscoyier @leaverou for follow css technologies

[AliMD]

karaye khafanetoon ro too i site begzarin http://codepen.io

[akbarzadeamin]

@ albertreza khobi? che khabar?

[albertreza]

@akbarzadeamin khobam mamnon menu hamo dd?

[albertreza]

@AliMD ostad b man begin che khabare ? chikar konam alan?

[albertreza]

sub menu chie?

[dante1357]

@albertreza sub menu hamun zir menu e! masalan miri ru gallery ye chand ta li dare, yeki az un li ha baz khodesh dakhele khodesh masalan chand ta li dre! be un migan sub menu

[albertreza]

@dante1357 mamnom. @AliMD had aghal y farghi bein man v bache haii k anjam nadadan ghael mishodin.

[AliMD]

@dante1357 lotfan nazaret ro rajebe be students level va top work begoo va age be nazaret bayad taghir kone albate man students level ro bar asase shenakht khodam sare class neveshtam na serfan home work hashoon osooli code zadan ham baraye man felan mohemtar az zahere

[AliMD]

@albertreza rast migi, deghat nakardam chon ghayeb boodan tartibesho taghir nadade boodam eslah shod

[Mahmoodian]

@AliMD ostad B khoda khodam dorosteshoon kardam :| yani dar in had herfeyiye :D

[Mahmoodian]

@AliMD kho mage Batene karam bade ke top nashode ?! daghighan moshkeleshoon chye?

[ghost]

Saalllaamm

iinam az ABR !

Clouds : http://jsbin.com/eleyis/22 (baraye iin k behtar bshe ykam sabr konin ;) ) Rainy Cloud : http://jsbin.com/udawoz/13/ (Ehtemaalan baadan Ra'd o bargh ham besh ezafeh konam :+1: ) (baadan ehtemaalan be mebu ham rabt bedam :O ! )

Nazaretun ro begin Lotfan ;) lotfan nazaretun ro raje be cod hash bgin !

[Mahmoodian]

@mghayour Aliyan ... :+1:

[lastshepherd]

Ostad on link kar nahayi nabod. linksh ro eslah kardam. farmodid dobare benevis az aval, shoro be neveshtan kardam.

Link Kar Ghably: Nahaea

Ostad Khodaeesh Kolan Kare In Jalase Dast Pokhte Khodam Bod. On CSS i ro ke farmodid ro ham omadam ta edit 12 azash estefade karde bodam valy dar edit 13 pakesh kardam. :broken_heart:

Link Kare Jadid: Dar Hale Sakht

[ghost]

Slm

@alimd OR SUPPORTERS :question: SOAL : iin darage baraye gradiant tu sdandard ba -webkit- , -moz- -o- farg dareh ! Chera akhe ? Masalan tu sdandard 0 yani az paiin b bala amma tu baghie 0 yani az chap b rast !!!

SOAL 2 : chejoori mishe bgim k vaghti child hover shod parent taghiir koneh ???!! {masalan tu yek menu rangi har "li" k hover shod back-ground-color menu asli be rang oon dar biad !! }

SOAL 3 : chejoori mihe bgim vaghti y 'li' hover mishe 'li' haye kenarish kamrang bshan va iin por rang bshe ???!!

[ehsansh]

@mghayour abrat ghashange afarin dar morede soale 2 doreie D1 kheili donbalesh budam ino neveshtam http://jsbin.com/amogen/2/edit ruie menu boro bad ruie about bad submenuei about ...... fek konam osooli nis in rah

[ghost]

@ehsansh mamnun nfahmidam manzooret daghighan kojast ! (fek konam manzur mano eshtebaah fahmidi !) (man mikham child hover beshe parent taghiir kone na perent hover beshe child taghiir kone !) (masalan vaghti tu yek menu rangi kar mikonim harkodoom hover shod menu be rang oon dar biad !)

@mahmoodian mamnun

lotfan nazaretun ro raje be cod hash bgin !

[lastshepherd]

:+1: NICE CLOUD........

[ehsansh]

@mghayour bebin daghighan hamino k migi ro un moghe kheili donbalesh budam vali guia rahi nadare.... hala baste b kari k mikhai bekoni shaiad beshe ie tarafandi bezani masalan man mikhastam vaghti About hover mishe rangesh ghermez bashe vali vaghti li haie ke bachash hastan hover mishan range about k parent un li ha hast avaz beshe va dige ghermez nabashe ....nemidunam morede to daghighan chie codato bezari malum mishe

[ghost]

Salam

KAL KAL ++ 2

felan daram ru iin kar mikonam rang bandi hanu kar dare ! yeksery irad haye koochik ham hast ! amma darkol khoob shodeh ! baad mikham ro "multiple sub menu" kar konam , hanu tu in ghesmat moshkel dareh !

CIRCULAR Sub-MENU http://jsbin.com/oqiqef/13 (lotfan raje be cod ha nazar bdin !)

Hariif mitalabam !

____UpDaTe : +Rotate, Some bug fixed, NoProblem With Chrome : http://jsbin.com/oqiqef/16

____ UpDaTe : +Multiple SubMenu !, More butifuller : http://jsbin.com/oqiqef/23 ;) (khodam midunam ba'zi az oon "li" ha khali ezafian, amma baraye khana tar shodan gozashtam bashe ! ) {4>3>3>3 ;) }

[ghost]

@ehsansh masalan tu hamin baalaii mikham masalan vaghti taraf mire tu "menu1" baghie menu ha napadid beshan ! (opaciry:0) !!!! kasi hast bdooneh ?

[ehsansh]

@mghayour nemidunam ba css kheii sakht mishe ....ini k mikhai mishe elemetn hamsaie na parent ie rah vase hamsaieha has injuri http://jsbin.com/udoreq/2/edit vali in faghat hamsaiehaie badio taghir mide na ghabli

[ghost]

Salam be hame

dar morede iin ke child hover beshe va parent taghiir koneh

zaheran ta CSS3 nemishe ! http://css-tricks.com/parent-selectors-in-css/ http://remysharp.com/2010/10/11/css-parent-selector/

Vali khob belakhareh JS ke hast ;) (ba in js code mishe moshkel ro hal kard ;) ) https://github.com/Idered/cssParentSelector

alaveh bar oon mesike tu CSS4 mikhad biad ! http://dev.w3.org/csswg/selectors4/

@ehsansh Are ! mesike nmishe ! vali chera vase har p joda neveshteh budi ! hamin bass bud ! http://jsbin.com/udoreq/6/

Be har hall ta JS o darim gham nadarim ;))

@AliMD OR SUPPORTERS Eshkali dare az js estefadeh konim ;) ?

___KalKal++2 UpDaTe : +Rotate, Some bug fixed, NoProblem With Chrome : http://jsbin.com/oqiqef/16

[ehsansh]

@mghayour to mikhai in shekli beshe? http://jsbin.com/oxapul/3 barat ba js neveshtam

[ghost]

@ehsansh Mamnun hmin ro mikhastam :+1: Amma ... age gharare paye JS va jQuery vasat biad fek konam behtare bi khial bsham ! Be har haal kheyli mamnunam :ok_hand:

___KalKal++2 UpDaTe : +SubMenu, More butifuller : http://jsbin.com/oqiqef/22 ;) (khodam midunam ba'zi az oon "li" ha khali ezafian, amma baraye khana tar shodan gozashtam bashe ! )

[albertreza]

heif k khob sub menu ro yad nagereftam.

[albertreza]

2stan soporter man jsbinam eroro mide . nemitonam bazesh konam chikar konam????? 504 Gateway Time-out

[dante1357]

@lastshepherd tu in kar daghighan chera be

 .main_menu li

border radius dadi!?

[dante1357]

@mghayour in abr haro khodet neveshti ya kesh rafti bala?! :D :)) ghashangan! :D

[dante1357]

@albertreza man ke nemidunam. ye cache ya cookie haye browserto pak kon, ya az browser dge estefade kon shayad dorost shod, nashod bayad windowseto avaz koni!!!!! :D :P

age jsbin baz nemishe az codepenion estefade kon, be har hal yejuri karato bezar! bahune nayar! :P

[dante1357]

@mghayour in class e w2 makhshuse css e , soraghe js narin chon faydei nadare, qeyre osuli yad migirin. ishala w3 js kar mishin! :)

vase in menu e CIRCULAR age 9 ta zir menu shod chi? :P :D qashang shode, afarin, code hatam khube! :)

@mghayour :+1:

baghie mese @mghayour va @ehsansh kar konan! aghab nayoftin az in dota!

[ehsansh]

@dante1357 bah bah dante khosh umadi b issuie ma :) hala k umadi ie soali bebin mikham ie elementi dashte basham mouse rush mire ba css neveshtehash avaz she injuri : http://jsbin.com/ayefaj/5/edit ke bad masalan tuie menu azash estefade beshe http://jsbin.com/ibiquk/2/edit monteha nemidunam chetori un neveshtehaie k tuie tage a nistan dide nashan nemidunam overflow hidden ro b chi bedam alan ...it's so complicated

[ghost]

@dante1357 Are jooone khodam ! ABR ha jar khodame bavar nadari yekshanbe barname ii ke bahash sorat ha ro random dadam bet neshoon midam {baadesham makhsoosan toosh az atribute data-.. estefadeh kardam} Mamnun :ok_hand:

+Bashe bikhial js ;)

dar morede CIRCULAR MENU ham , oon faghat bara fun va KALKAL hast ;)) (khodam kheiiili khsham umad :D ) multiple submenu ro ham support mikone vali bara harkodoom 3 ta ! (masalan menu 4 > sub 3 > sub 3 > sub 3) darzemn oonaii ke submenu daran yek shadow zard mikhoran.

@ehsansh overflow: hidden ro be div bayad bedi dg ! mage intory nmikhai ? http://jsbin.com/ayefaj/7/edit vase menu ham be li bede

[dante1357]

@ehsansh chakeram dadash! :)

vase soaletam @mghayour javab dad dge, man sokut ekhtiar mikonam! :D

[ehsansh]

@mghayour tuie un ke bale tuie in http://jsbin.com/ibiquk/2/edit chetori un neveshtehaie radif dovom napadid mishe?

[ghost]

bayad bara "li" height bezari ke faghat ertefa uun "a" ke mikhay dashte bashe masalan iinjuri :

  height: 38px;  
  overflow: hidden;

[ehsansh]

aha khodam iaftam :) b nav menu ertefa dadam behesh overflow hidden dadam injuri http://jsbin.com/ibiquk/4/edit faghat nemidunam ertefa dadan b nav menu doroste ia na

[dante1357]

@ehsansh ehsan jan ertefa bede khob!!!! :D haminjuri ke overflow hiiden nemishe! :D

[ehsansh]

@dante1357 ras migi albate baiad bebinam tuie submenu b moshekli mikhore in ravesh ...

[ghost]

@ehsansh be li ertefa bde khob ! (fek konam tu submenu moshkel bokhori) 38px kon ertefa ro ! be ghole ostaad font-size ham bede ta hame browser ha hamsan bashe va beham narize !

[MahdiWD]

http://jsbin.com/ehasur/2/edit sharmande ke dr shod internetam ghat shod