Effects Menüsü:Bu bölümümüzde web sayfamızda resimlerimizin yada "DIV" elemanımızın içine eklediğimiz herşeyi hareketli efektler vermek için kullanırız



Appear/Fade:Resmimizin direk olarak yada yumuşatılarak koybolma efekti vermek için kullandığımız bir efektir. bu efektimizi yapmak için öncelikle bir "DIV" eklememiz gerekmektedir desing sayfamızın üst tool barında bulunan "Layout" sekmemizden ekleyebiliriz aşağıdaki resmimizde nerden yapıldığını gösteriyorum



Ve daha sonra "DIV"imizin içine bir resim ekliyoruz bunuda yine "Desing" sayfamızın "Common" sekmesinden "İmage" bölümünden ekliyoruz aşağıdaki gibi.



 Resmimizide ekledikten sonra "Desing " sayfamızın sağ tarafında bulunan "Behaviors" bölümden "Effects" sekmesinden "Appear/fade" tıklıyoruz



Ve daha sonra karşımıza "Appear/Fade" bölümümüzdeki ayarlar karşımıza çıkmaktadır burada kullancağımız efekti ve nasıl bir sekilde olcağını seçiiyoruz ve düzenliyoruz



şimdi ayarlarımızda yaptıktan sonra hazırladığımız efekt aşağıdaki gibi olacaktır

Fade örneğimiz:Mouse ile üstüne tıklıyoruz ve resmimiz ikinci resmimizdeki gibi seffaflaşarak kaybolmaktadır ve sonunda kaybolmaktadır resmimiz geri gelmemektedir üstüne tıklanmadığı sürece



Apper örneğimiz:Mouse ile üstüne tıkladığımızda bu sefer seffaflaşarak değil resmimiz direk kaybolmaktadır ve burda ki tek farkısımız seffaflaşmak değil resmimize tıkladıktan sonra gidip tekrar geri gelmesidir ikinci resmimizdeki gibi birden kaybolup geri gelmektedir.



Blind efecti:Web sayfamızdaki resimlere kaydırma efekti vermek için kullanırız genellikle
sayfamıza bu efekti eklemek için diğer efkte yaptığımız gibi sayfamıza bir "DIV" eklemek zorundayız aşağıdaki resimde olduğu gibi



Ve daha sonra eklediğimiz bu "DIV" içine bi resim eklemek zorundayız ki yaptığımız efekti görebilelim aşağıdaki gibi resim ekleye biliriz



resmimizde ekledikten sonra "Desing" sayfamızın sağ tarafında bulunan "Behaviors" menümüzden "Blind" eektimizi seçelim



bu bölümde "Blind" efektimizle ilgili ayarlar bulunmaktadr ve bu ayarların ne olduğu haknda aşağıdaki resmimizde bilgi vermektedir




yukardaki gibi ayarlarımızı yaptıktan sonra resmimizin uygulamasını aşağıdaki resimde görmekteyiz

 Blind up örneğimiz: aşağıda görüldüğü gibi "Blindup" efektimiz resmimizi aşağıdan yukarı doğru kaydırmaktadır


Blind down örneğimiz:Bu efektimizde ise resmimiz "Blind up"ın tersine aşağı doğru kaymaktadır


Grow/Shrink efekti:resmimizin sanki küçltüpte kaybolma yada olan resmimizin kaybetip büyüyerek çıkartma efekti vermek için kullanırız
öncelikle bu efektimizi uygulamak için her efekte yaptığımız gibi sayfamaıza bir "DIV" eklemek zorundayız



ve daha sonra eklediğimiz "dıv"ın içine bir resim eklemeliyiz



resmimizde ekledikten sonra "Desing" sayfamızın sağ tarafında bulunan "Behaviors" menümüzden "Grow/Shrink" efektimizi seçelim



bu bölümde "Grow/Shrink" efektimizle ilgili ayarlar bulunmaktadr ve bu ayarların ne olduğu haknda aşağıdaki resmimizde bilgi vermektedir



Bu ayarlar çerçevesinde uygulamamız aşağıdaki gibidir.

Grow örneğimiz:Bu efektimizde resmimiz önce kaybkolum tekradan büyüyerak geri gelmektedir yani mouse ile üstüne tıkladığımzda kaybolmakta sonra geri gelmektedir.



Shrink örneğimiz:Bu efektimizde ise resmimiz üstüne tıklandığında kendini ufaltarak kaybolmaktadır
 


Highlight efekti:B u efektimiz ise renk geçişli bir efektir belirlediğimiz renkten belirlediğimiz tenke doğru bir geçiş söz konusudur
yine sayfamıza bir "DIV" eklemek zorundayız



ve daha sonra eklediğimiz bu "DIV"in içine bir resim ekleyelim



bu işlemimizde yaptıktan sonra  "Desing" sayfamızın sağ tarafında bulunan "Behaviors" menümüzden "Highlight" efektimizi seçelim



bu bölümde "Highlight" efektimizle ilgili ayarlar bulunmaktadr ve bu ayarların ne olduğu haknda aşağıdaki resmimizde bilgi vermektedir



Bu ayarlarımızı yaptıktan sonra uygulamamız aşağıdaki gibidir aşağıda görüldüğü gibi renk geçişimiz sıralı bir sekilde yeşilden mavi ye gitmektedir



Shake efekti:resmimizin üstüne tıkladığımızda resmimizi titretme efekti yada sallama efekti vermek için kullanırız
yine sayfamıza bir "DIV" eklemek zorundayız



ve daha sonra eklediğimiz bu "DIV"in içine bir resim ekleyelim



bu işlemimizde yaptıktan sonra  "Desing" sayfamızın sağ tarafında bulunan "Behaviors" menümüzden "Shake" efektimizi seçelim



Ve daha sonra karşımıza "Shake" bölümümüzde yapacağımız fazla bir ayar gerekmemektedir sadece olayımızı gerçekleştireceğimiz nesneyi seçmemiz yeterli olacaktır



 uygulamamızda birinci resim daha sağ tarafa yakınken ikinci resmimiz sol tarafa daha yakın gözükmektedir burda size tam olarak olayı açaıklayamıyorum normalde resmimizin üstüne tıklandığında resmimiz sağ ve sola doğru hızlı hareket etmektedir.





Slide efekti:Nesnelerimiz yukarı aşağı doğru kaydırmamızı sağlar yanİ Blindup ve Blinddown ile aynı işlemi yapmaktadır
yine sayfamıza bir "DIV" eklemek zorundayız



ve daha sonra eklediğimiz bu "DIV"in içine bir resim ekleyelim



bu işlemimizde yaptıktan sonra  "Desing" sayfamızın sağ tarafında bulunan "Behaviors" menümüzden "Slide" efektimizi seçelim



Ve daha sonra karşımıza "Slide" bölümümüzde yapacağımız fazla bir ayar gerekmemektedir sadece olayımızı gerçekleştireceğimiz nesneyi seçmemiz yeterli olacaktır



şimdi ayarlamalarımıza göre yaptığımız uygulama aşağıdaki gibidir

Slide up örneğimiz:resmimiz yukardan sabitlenerek yukarı doğru çıkmaktadır yani bir bayrak çekmek gibi düşüne biliriz

Slide down örneğimiz:resmimiz yukarda sabitlenip aşağı doğru kaymaktadır yani bir bayrağı yukarıya bağlayıp aşağıya salmak gibi süşüne biliriz


Squish efekti:nesnemizi sol üst köşeye doğru hareket ettirip kaybetme efektidir
yine sayfamıza bir "DIV" eklemek zorundayız



ve daha sonra eklediğimiz bu "DIV"in içine bir resim ekleyelim



bu işlemimizde yaptıktan sonra sıra uygulamamızın efekt bölümündedir "Desing" sayfamızın sağ tarafında bulunan "Behaviors" menümüzden "Slide" efektimizi seçelim



yukarıda görüldüğü gibi sadece olayı uygulayacağımız nesneyi seçmemiz yetmektedir

şimdi yaptığımız örneğimizin uygulamasını görelim

görüldüğü gibi resmimiz sol üst köşeye sabitleenerek yukarı doğru çekilmektedir



Hazırlayan: Tolga GÜLBAKAN