Yii Framework Forum: How To User Fancybox - Yii Framework Forum

Jump to content

Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic

How To User Fancybox http://fancyapps.com/fancybox/ Rate Topic: -----

#1 User is offline   desatir7316 

  • Standard Member
  • PipPip
  • Yii
  • Group: Members
  • Posts: 266
  • Joined: 19-March 14

Posted 29 March 2014 - 02:39 PM

hi there
i copied fancyBox to assets\fancyBox\
so added this lines to my view\layouts\main.php:
	<script type="text/javascript" src="<?php echo Yii::app()->request->baseUrl;?>/assets/fancyBox/fancyapps/lib/jquery-1.10.1.min.js"></script>

	<!-- Add fancyBox main JS and CSS files -->
	<script type="text/javascript" src="<?php echo Yii::app()->request->baseUrl;?>/assets/fancyBox/fancyapps/source/jquery.fancybox.js?v=2.1.5"></script>
	<link rel="stylesheet" type="text/css" href="<?php echo Yii::app()->request->baseUrl;?>/assets/fancyBox/fancyapps/source/jquery.fancybox.css?v=2.1.5" media="screen" />

	<!-- Add mousewheel plugin (this is optional) -->
	<script type="text/javascript" src="<?php echo Yii::app()->request->baseUrl;?>/assets/fancyBox/fancyapps/lib/jquery.mousewheel-3.0.6.pack.js"></script>

	<!-- Add Button helper (this is optional) -->
	<link rel="stylesheet" type="text/css" href="<?php echo Yii::app()->request->baseUrl;?>/assets/fancyBox/fancyapps/source/helpers/jquery.fancybox-buttons.css?v=1.0.5" />
	<script type="text/javascript" src="<?php echo Yii::app()->request->baseUrl;?>/assets/fancyBox/fancyapps/source/helpers/jquery.fancybox-buttons.js?v=1.0.5"></script>

	<!-- Add Thumbnail helper (this is optional) -->
	<link rel="stylesheet" type="text/css" href="<?php echo Yii::app()->request->baseUrl;?>/assets/fancyBox/fancyapps/source/helpers/jquery.fancybox-thumbs.css?v=1.0.7" />
	<script type="text/javascript" src="<?php echo Yii::app()->request->baseUrl;?>/assets/fancyBox/fancyapps/source/helpers/jquery.fancybox-thumbs.js?v=1.0.7"></script>

	<!-- Add Media helper (this is optional) -->
	<script type="text/javascript" src="<?php echo Yii::app()->request->baseUrl;?>/assets/fancyBox/fancyapps/source/helpers/jquery.fancybox-media.js?v=1.0.6"></script>

   <!-- Add Media helper (this is optional) -->
   
	<script type="text/javascript" src="<?php echo Yii::app()->request->baseUrl;?>/assets/fancyBox/fancyapps/fancyBox.js"></script>
	<link rel="stylesheet" type="text/css" href="<?php echo Yii::app()->request->baseUrl;?>/assets/fancyBox/fancyapps/fancyBox.css" />



fancyBox.css is contain css script in index.html in fancyBox:
<style type="text/css">
		.fancybox-custom .fancybox-skin {
			box-shadow: 0 0 50px #222;
		}

		body {
			max-width: 700px;
			margin: 0 auto;
		}
	</style>


and fancyBox.js contain js script in index.html in downloaded fancyBox

in my view file i add this line but it doesn't work:

<p>
		<a class="fancybox" href="<?php echo Yii::app()->request->baseUrl .'/images/categories/1.jpg' ?>" data-fancybox-group="gallery" title="Lorem ipsum dolor sit amet"><img src="<?php echo Yii::app()->request->baseUrl .'/images/categories/1.jpg' ?>" alt="" /></a>
</p>


what is the problem?
0

#2 User is offline   desatir7316 

  • Standard Member
  • PipPip
  • Yii
  • Group: Members
  • Posts: 266
  • Joined: 19-March 14

Posted 29 March 2014 - 03:11 PM

i clear my layouts\main.php of js include and added these lines to view file:
$cs=Yii::app()->clientScript;  
$cs->registerScriptFile(Yii::app()->request->baseUrl.'/assets/fancyBox/fancyapps/lib/jquery-1.10.1.min.js', CClientScript::POS_HEAD); 
$cs->registerScriptFile(Yii::app()->request->baseUrl.'/assets/fancyBox/fancyapps/source/jquery.fancybox.js?v=2.1.5', CClientScript::POS_HEAD); 
$cs->registerScriptFile(Yii::app()->request->baseUrl.'/assets/fancyBox/fancyapps/lib/jquery.mousewheel-3.0.6.pack.js', CClientScript::POS_HEAD); 
$cs->registerScriptFile(Yii::app()->request->baseUrl.'/assets/fancyBox/fancyapps/source/helpers/jquery.fancybox-buttons.js?v=1.0.5', CClientScript::POS_HEAD); 
$cs->registerScriptFile(Yii::app()->request->baseUrl.'/assets/fancyBox/fancyapps/source/helpers/jquery.fancybox-thumbs.js?v=1.0.7', CClientScript::POS_HEAD); 
$cs->registerScriptFile(Yii::app()->request->baseUrl.'/assets/fancyBox/fancyapps/source/helpers/jquery.fancybox-media.js?v=1.0.6', CClientScript::POS_HEAD); 
$cs->registerScriptFile(Yii::app()->request->baseUrl.'/assets/fancyBox/fancyapps/fancyBox.js', CClientScript::POS_HEAD); 


what is my problem, it does not work yes :(
0

#3 User is offline   Pecos 

  • Junior Member
  • Pip
  • Yii
  • Group: Members
  • Posts: 22
  • Joined: 21-March 14

Posted 29 March 2014 - 03:14 PM

Do you call Fancybox? Didn't see it in your code. Something like this.

$(document).ready(function() {	
	$("a.fancybox").fancybox();
});


http://fancybox.net/howto
0

#4 User is offline   desatir7316 

  • Standard Member
  • PipPip
  • Yii
  • Group: Members
  • Posts: 266
  • Joined: 19-March 14

Posted 29 March 2014 - 03:28 PM

thanks , it worked
i used it like below in my view file

<script>
$(document).ready(function() {	
	$("a.fancybox").fancybox();
});
</script>

0

Share this topic:


Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic

1 User(s) are reading this topic
0 members, 1 guests, 0 anonymous users