Fancy Inspirations

From ThaiiS Note (Wiki)

Jump to: navigation, search

There are security restrictions on this page

Inspirations_Box > LightBox_Inspirations | Fancy Inspirations

FLASH!!!!! to image

Fancy Box Sample http://wiki.thaiis.biz/upload/fancybox/index.html

Fancy Box Sample 2 http://wiki.thaiis.biz/upload/fancybox/fancybox.html

finearts.cmu.ac.th

The html: OPEN fancybox home page

<addhtml>
<head>
<script type="text/javascript"> 
$(document).ready(function() {
   $("a#nested").fancybox({
      'frameWidth': 900, 'frameHeight': 450, 'hideOnContentClick':
false
      });
  });
</script>
</head>
The html:
<a id="nested" href="http://fancy.klade.lv/example?iframe" >OPEN
fancybox home page</a> 
</addhtml>

http://jquery.diaz-cornen.com/fancybox/index_flash.html Swfobject

header for fc

<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="http://www.artifile.com/js/fancybox/jquery.fancybox-1.3.1.pack.js"></script>
<script type="text/javascript" src="http://www.artifile.com/js/fancybox/jquery.easing-1.3.pack.js"></script>
<link rel="stylesheet" href="http://www.artifile.com/js/fancybox/jquery.fancybox-1.3.1.css" type="text/css" media="screen" />
<script type="text/javascript">
$j=jQuery.noConflict();
$j(document).ready(function() {
							$j("[href$='.jpg'],[href$='.png'],[href$='.gif']").attr("rel","thumbgroup");
  });

</script>

<script type="text/javascript">
$j=jQuery.noConflict();
$j(document).ready(function() {
$j("a[rel=thumbgroup]").fancybox({
				'transitionIn'	: 'elastic',
				'transitionOut'	: 'elastic',
			//	'titlePosition' 	: 'over',
						'padding' : 0,
							'titlePosition' : 'outside',
								'overlayShow'	:	false,
				'titleFormat'		: function(title, currentArray, currentIndex, currentOpts) {
					return '<span id="fancybox-title-over"> '   + (title.length ? '   ' + title : '') + '</span>';
				}
								 });
});
</script>

Iframe js

<script type="text/javascript"> 
$(document).ready(function() {

	$("#div").fancybox({
		'width'				: '75%',
		'height'			: 500,
        'autoScale'     	: false,
        'transitionIn'		: 'none',
		'transitionOut'		: 'none',
		'type'				: 'iframe'
	});	});
	</script>

Iframe html

<a id="div" href="http://www.google.ca/">Iframe</a>