• 19-10-2015, 19:21:59
    #1
    Merhaba bloğumun sevgi ve saygıdeğer takipçileri. Bu yazımda sizlere yabancı kaynaklarda rastlamış olduğum sarsıntı efektini nasıl kullanabileceğinizi anlatacağım.

    Sarsıntı efekti olarak kastettiğim şey tam olarak aşağıdaki gibidir. Resimlerde ve yazılarda kullanılan güzel bir özellik.

    Demo görüntüyü buraya ekleyemediğim için bu linkten görebilirsininiz.

    Nasıl Kullanılır ?

    Nasıl kullanılacağına gelecek olursak face isminde bir div oluşturuyorsunuz ve aşağıdaki kodları stil dosyanıza ekliyorsunuz.

    .face:hover {
     animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
     transform: translate3d(0, 0, 0);
     backface-visibility: hidden;
     perspective: 1000px;
    }
    
    @keyframes shake {
     10%, 90% {
     transform: translate3d(-1px, 0, 0);
     }
     
     20%, 80% {
     transform: translate3d(2px, 0, 0);
     }
    
     30%, 50%, 70% {
     transform: translate3d(-4px, 0, 0);
     }
    
     40%, 60% {
     transform: translate3d(4px, 0, 0);
     }
    }
    Kaynak
  • 20-10-2015, 18:10:01
    #2
    Üyeliği durduruldu
    hocam site de verdiğiniz kodda güzel. Size bi sorum var blogger dan anlıyormusunuz?
    benim temayı virüs gibi görüyor js nin biri sıkıntılı galiba
  • 20-10-2015, 19:13:21
    #3
    KILIC adlı üyeden alıntı: mesajı görüntüle
    hocam site de verdiğiniz kodda güzel. Size bi sorum var blogger dan anlıyormusunuz?
    benim temayı virüs gibi görüyor js nin biri sıkıntılı galiba
    Hocam blogger bilgim sıfır
  • 20-10-2015, 19:19:01
    #4
    Üyeliği durduruldu
    emirhanbulbul adlı üyeden alıntı: mesajı görüntüle
    Hocam blogger bilgim sıfır
    hocam css ve html den oluşuyor yalnız js nin içinde bişey var
  • 20-10-2015, 19:22:05
    #5
    KILIC adlı üyeden alıntı: mesajı görüntüle
    hocam css ve html den oluşuyor yalnız js nin içinde bişey var
    Bilmiyorum hocam, yardımcı olamayacağım.