ЈКуери УИ - Табови и хармонике

Постоји много начина за прављење табова и хармоника, али дефинитивно јКуери и ваш библиотечки пакет Корисничко сучеље јКуери пружају нам најбржи и најефикаснији начин за имплементацију ових елемената.
Трепавице
Картице нам омогућавају да групишемо информације на нашој веб страници према темама, што корисницима омогућава да брзо и лако добију релевантне информације само одабиром жељене картице.
Метод табс ()
Метода табс(оптионс) изјављује да елемент ХТМЛ -а и његов садржај морају бити приказани на картицама, параметри опција су објекат који специфицира изглед и понашање картица.
Метода табс () може се користити на два начина:
• $ (бирач, контекст). Картице (опције)
• $ (селектор, контекст) .табс ("акција", парами)
Погледајмо пример његове имплементације:
  • Укључујемо потребне датотеке, библиотеке јКуери и ЦСС:




  • Ми креирамо нашу инстанцу методе табс () и повезујемо га са селектором:

  • Коначно у нашем ХТМЛ -у стварамо садржај који ће бити форматиран на нашим картицама, важно је напоменути да мора бити у складу са структуром ознаказатим етикете
      и на крају етикетеза метод идентификације сваке картице.
  • Погледајмо како овај пример изгледа у нашем прегледачу:

    Ево потпуног кода да бисте га могли тестирати:



    ЈКуери УИ Табс - Подразумевана функционалност









  • Нунц тинцидунт

  • Проин бол

  • Аенеан лациниа



  • Таб тест 1.




    Морби тинцидунт, дуи сит амет фацилисис феугиат, мрзим метус гравида пре, ут пхаретра масса метус ид нунц. Дуис сцелерискуе аннои турпис. Жеђ фрингилла, масса егет луцтус малесуада, метус ерос нелагодност лецтус, ут темпус ерос масса ут бол. Аенеан аликует фрингилла сем. Суспендиссе сед лигула ин лигула сусципит аликуам. Праесент ин ерос вестибулум ми адиписцинг адиписцинг. Морби фацилисис. Цурабитур орнаре посљедица нунц. Аенеан вел метус. Ут посуере виверра нулла. Аликуам ерат волутпат. Пеллентескуе цонваллис. Маеценас феугиат, теллус пеллентескуе претиум посуере, фелис ​​лорем еуисмод фелис, еу орнаре лео ниси вел фелис. Маурис цонсецтетур тортор ет пурус.




    Таб тест 3.






    Хармоника
    Као и табови, хармоника организује информације са посебношћу да то чини по блоковима у којима ће бити приказане само информације о изабраном блоку, док остале остају скривене.
    Метода хармонике ()
    Метода хармоника (опције) наводи да ће се елементом ХТМЛ-а и његовим садржајем управљати као менији типа хармоника. Као и метода табс, опције ће одредити њено понашање и изглед.
    Метода хармоника () може се користити на два начина:
    • $ (селектор, контекст). Хармоника (опције)
    • $ (селектор, контекст). Хармоника ("акција", парами)
    Погледајмо пример његове имплементације:
    • Укључујемо потребне датотеке, библиотеке јКуери и ЦСС:
    • Ми креирамо нашу инстанцу методе хармоника () и повезујемо га са селектором:


    • На крају креирамо наш ХТМЛ поштујући структуру ознакегенерал, праћене другим ознакамакоји ће послужити за идентификацију сваког блока.

    Наш пример ће изгледати овако у прегледачу:

    Да ли вам се допао и помогао овај водич?Можете наградити аутора притиском на ово дугме да бисте му дали позитиван поен

    Да ли вам је овај водич помогао?

    Ако не

    ПОМОЗИТЕ ПОБОЉШАЈТЕ ОВАЈ ВОДИЧ!

    Мислите ли да можете исправити или побољшати овај водич? Можете послати своје издање са променама које сматрате корисним.
    0 корисника је уредило ово упутство. Уредите и постаните признати стручњак!
    Измените овај водич

    СЛИЧНИ ВОДИЦИ


    Како превлачити и преузимати слике помоћу ЈКуери корисничког интерфејсаКако направити Спиннер или икону учитавања помоћу ЈКуери -јаЈКуери додаци и библиотеке за веб развојФлекигрид динамичка мрежа са ЈКуери и ПХПРегуларни изрази са ЈкуериУправљање заокретним табелама помоћу додатка Јкуери ДататаблесРазумевање АЈАКС -а са јКуери -јемФилтри у селекторима са Јкуери и ЦСС3 ИИ

    Нема коментара, будите први!

    Не чекајте више и уђите у СолветицОставите своје коментаре и искористите кориснички налог Придружите нам се!
    • Региструј сеРегиструјте се БЕСПЛАТНО да бисте имали свој Солветиц налогРегиструјте
    • ИдентифиДа ли већ имате налог? Пријавите се овдеИдентификујте ме на мом налогу

      Информације

      • Објављено 12. август 2013. 00:54
      • Посете 3.7К
      • НивоПрофесионално

      Најновији ЈаваСцрипт водичи
      • Како ажурирати НПМ помоћу ПоверСхелл -а у оперативном систему Виндовс 10
      • Како превлачити и преузимати слике помоћу ЈКуери корисничког интерфејса
      • Како направити Спиннер или икону учитавања помоћу ЈКуери -ја
      • Како превести веб страницу на неколико језика
      Погледајте више о ЈаваСцрипт -у

    Ви ће помоћи развој сајта, дељење страницу са пријатељима

    wave wave wave wave wave