Plugin ImageSwitch jest prosty, szybki i łatwy w użyciu, a przy tym umożliwia naprawdę genialne efekty przechodzenia pomiędzy zdjęciami.
Wtyczka idealnie nadaje się do części wizerunkowej na twojej stronie internetowej, a czas wdrożenia tego rozwiązania jest naprawdę niewielki.
Składnia wtyczki ImageSwitch z wartościami domyślnymi:
$.ImageSwitch({
Type: "FadeIn", // Type of effect to run the function
NewImage: "", //The new image will be loaded in
EffectOriginal: true,
Speed: 1000, //Speed of the effect
StartLeft: 50, //The position the effect start compare
to original position could be (-)
StartTop: 0,
StartOpacity: 0, //Which start opacity it would be
EndLeft: -50, //The position the effect end compare
to the original position could be (-)
EndTop: 0,
EndOpacity: 0, //Which start opacity it would be
Direction: "RightLeft", //Which Way the image will be sroll
Door1: "", //The image for the door 1
Door2: "" //The image for the door 2
}, function);Oczywiście, aby zastosować plugin musisz posiadać jQuery javascript, a następnie ściągnąć i zainstalować plugin ImageSwitch.
Kod HTML:
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript"
src="Groject.ImageSwitch.js"></script>
Następnie nalezy utworzyć <IMG>, który będzie używany do załadowania nowego obrazu. Możesz zastosować dowolną nazwę. W naszym przykładzie jest to: TestImg. Potrzebny jest też przycisk do wyzwalania efektu. Możesz go umieścić za pomocą linku.
<img id="TestImg" src="Image%20Path">
<a href="http://www.hieu.co.uk/blog/index.php/
imageswitch/docs/#" id="TestTrigger"></a>
Pełny kod użycia ImagSwitch:
$(document).ready({
$("#TestTrigger").click(function(){
$("#TestImg").ImageSwitch({NewImage:"image2"});
});
});
To wszystko :) Ściągnij i ciesz się świetnymi efektami ImageSwitch 
DOWNLOAD
