0
Kayıt Ol

Mobil Tema Yapımı Yardım

5

●

3.357

  • 17-09-2013, 22:39:25
    #1
    Micron
    Micron
    Regnos.com
    Selamun Aleykum.
    Arkadaşlar online chat sitem mevcut. Bu sitemi mobile uyarlamak istiyorum. Css html bilgim mevcut ama daha önce mobil tema yapmadım araştırdım jequrymobile ile bişiler yaptım ama oda standart bir tema çıkartıyor. kendi tasarımımla bişiler yapıcam bana bu konuda yardımcı olurmusunuz kaynak olabilir. En pratik nasıl yapabilirim çok zaman kaybettim. bana fikir kaynak verirseniz sevinirim teşekkür ederim.
  • 17-09-2013, 22:58:24
    #2
    TylerDurden
    TylerDurden
    Üyeliği durduruldu
    her şeyin en pratiği, yapılmışı incelemek bence.

    şunu indirip inceleyin: http://liquidgem.birondesign.com/

    demo: http://liquidgem.birondesign.com/demo/index.html

    demo css: http://liquidgem.birondesign.com/demo/css/style.css

    önemli olan değerleri yüzde olarak vermek. 100px demeyeceksiniz de, 10% diyeceksiniz mesela.

    ve diğer önemli kısım:

    Alıntı
    @media only screen and (max-width: 510px) { ... }
    bunun anlamı, tarayıcı genişliği maksimum 510px iken, bu kodları çalıştır. aksi halde, temel kodları çalıştır. bu özel düzenleme, genel düzenlemeden önceliklidir.

    mesela genel css'de, üstteki menünün arkaplanı siyah demiş olalım:

    Alıntı
    nav {background:#000;}
    ama genişlik 320px iken(iphone), background beyaz olsun:

    Alıntı
    nav {background:#000;}
    @media only screen and (max-width: 320px) { nav {background:#fff;} }
    özel düzenlemedeki "arkaplan beyaz olsun" aktif hale gelir. genel düzenlemedeki değeri tarayıcı önemsemez.

    kısacası, şu anki temanızı iphone'a uydurmak için, css dosyanızın altına

    Alıntı
    @media only screen and (max-width: 320px) { ...} }
    yazın ve site nasıl gözükmeliyse o kodları girin. mesela üst menü iphone'da gözükmesin:

    Alıntı
    @media only screen and (max-width: 320px) { nav{display:none;} }
    yaptığınız temayı test etmek için: http://mattkersley.com/responsive/
  • 17-09-2013, 23:18:39
    #3
    Micron
    Micron
    Regnos.com
    hocam bu verdiğiniz demo ekşi sözlük tarzı. direk tarayıcıyı küçültünce otomatik mobile geçiyor. Ben özel tasarım yapıcam sıfırdan css sini kodlıcam. %100 de değerler kullanarak yapmaya çalıştım ama bazı yerlerde takıldım istediğim gibi olmadı. En dış alana 100% veriyodum içinde sol bloka 20% orta kısmada %80 veriyodum. ama telde sorun çıkartıyodu tam istediğim gibi olmadı. imzamdaki siteyi çeviricem mobile. sitedeki tüm özellikler olmasada gene temel özellikler olucak mobilde özel mobil tema çizip kodlıcam. % de kullanımı blokları % delerde ayırma felan buralarda takıldım. Yukarda belitttiğiniz şekilde benim siteme uymuyor sanırsam yada baştan kodlanması gerek. Bu arada çok teşekkür ederim. tek istediğim şu mobili bir an önce yapmak
  • 17-09-2013, 23:53:02
    #4
    josef
    josef
    /* for 980px or less */
    @media only screen and (min-width: 768px) and (max-width: 980px) {

    }

    /* for 480px or less */
    @media only screen and (min-width: 480px) and (max-width: 640px) {


    }
    /* for 320px or less */
    @media only screen and (min-width: 320px) and (max-width: 480px){

    }

    /* for 240px or less */
    @media only screen and (min-width: 240px) and (max-width: 320px){

    }

    bütün çözünürlükte görünmesi için böyle yaptım 480px üstündekilerde düzgün çalıştı fakat

    240 x 320 (small phone)
    320 x 480 (iPhone

    olmuyor acaba neden ?
  • 17-09-2013, 23:59:57
    #5
    aztech
    aztech
    istedigniz boyutlara gore kodlama yapacaksiniz, nette baya bi kaynak var responsive tutorial diye aratip incelerseniz ilerlersiniz.
  • 18-09-2013, 08:19:15
    #6
    emirhanguven
    emirhanguven
    sana tavsiyem boots trap kullan işini çözsün o kadar basit