Tema: Configurar tamaño de div en jquery
Ver Mensaje Individual
  #6 (permalink)  
Antiguo 19/04/2015, 04:36
Avatar de satjaen
satjaen
 
Fecha de Ingreso: septiembre-2012
Ubicación: Jaén (Andalucía)
Mensajes: 893
Antigüedad: 12 años, 4 meses
Puntos: 10
Respuesta: Configurar tamaño de div en jquery
He probado con estos parámetros pero no funciona:

Código HTML: 
Ver original
  1. // Size & Position                         
  2.                     min_width               :   400,            // Min width allowed (in pixels)
  3.                     min_height              :   200,            // Min height allowed (in pixels)
  4.                     vertical_center         :   1,          // Vertically center background
  5.                     horizontal_center       :   1,          // Horizontally center background
  6.                     fit_always              :   0,          // Image will never exceed browser width or height (Ignores min. dimensions)
  7.                     fit_portrait            :   1,          // Portrait images will not exceed browser height
  8.                     fit_landscape           :   0,          // Landscape images will not exceed browser width
Código HTML: 
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  4.  
  5.     <!--
  6.         Supersized - Fullscreen Slideshow jQuery Plugin
  7.         Version : 3.2.7
  8.         Site    : www.buildinternet.com/project/supersized
  9.         
  10.         Author  : Sam Dunn
  11.         Company : One Mighty Roar (www.onemightyroar.com)
  12.         License : MIT License / GPL License
  13.     -->
  14.  
  15.     <head>
  16.  
  17.         <title>Supersized - Full Screen Background Slideshow jQuery Plugin</title>
  18.         <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
  19.         
  20.         <link rel="stylesheet" href="css/supersized.css" type="text/css" media="screen" />
  21.         <link rel="stylesheet" href="theme/supersized.shutter.css" type="text/css" media="screen" />
  22.         
  23.         <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
  24.         <script type="text/javascript" src="js/jquery.easing.min.js"></script>
  25.         
  26.         <script type="text/javascript" src="js/supersized.3.2.7.min.js"></script>
  27.         <script type="text/javascript" src="theme/supersized.shutter.min.js"></script>
  28.         
  29. <script type="text/javascript">
  30.             
  31.             jQuery(function($){
  32.                 
  33.                     $.supersized({
  34.                 
  35.                     // Functionality
  36.                     slideshow               :   1,          // Slideshow on/off
  37.                     autoplay                :   1,          // Slideshow starts playing automatically
  38.                     start_slide             :   1,          // Start slide (0 is random)
  39.                     stop_loop               :   0,          // Pauses slideshow on last slide
  40.                     random                  :   0,          // Randomize slide order (Ignores start slide)
  41.                     slide_interval          :   4000,       // Length between transitions
  42.                     transition              :   6,          // 0-None, 1-Fade, 2-Slide Top, 3-Slide Right, 4-Slide Bottom, 5-Slide Left, 6-Carousel Right, 7-Carousel Left
  43.                     transition_speed        :   1000,       // Speed of transition
  44.                     new_window              :   1,          // Image links open in new window/tab
  45.                     pause_hover             :   0,          // Pause slideshow on hover
  46.                     keyboard_nav            :   1,          // Keyboard navigation on/off
  47.                     performance             :   1,          // 0-Normal, 1-Hybrid speed/quality, 2-Optimizes image quality, 3-Optimizes transition speed // (Only works for Firefox/IE, not Webkit)
  48.                     image_protect           :   1,          // Disables image dragging and right click with Javascript
  49.                                                                
  50.                     // Size & Position                         
  51.                     min_width               :   400,            // Min width allowed (in pixels)
  52.                     min_height              :   200,            // Min height allowed (in pixels)
  53.                     vertical_center         :   1,          // Vertically center background
  54.                     horizontal_center       :   1,          // Horizontally center background
  55.                     fit_always              :   0,          // Image will never exceed browser width or height (Ignores min. dimensions)
  56.                     fit_portrait            :   1,          // Portrait images will not exceed browser height
  57.                     fit_landscape           :   0,          // Landscape images will not exceed browser width
  58.                                                                
  59.                     // Components                           
  60.                     slide_links             :   'blank',    // Individual links for each slide (Options: false, 'num', 'name', 'blank')
  61.                     thumb_links             :   1,          // Individual thumb links for each slide
  62.                     thumbnail_navigation    :   0,          // Thumbnail navigation // Landscape images will not exceed browser width
  63.                     slides                  :   [           // Slideshow Images
  64.                                                         {image : 'http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/slides/kazvan-1.jpg', title : 'Image Credit: Maria Kazvan', thumb : 'http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/thumbs/kazvan-1.jpg', url : 'http://www.nonsensesociety.com/2011/04/maria-kazvan/'},
  65.                                                         {image : 'http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/slides/kazvan-2.jpg', title : 'Image Credit: Maria Kazvan', thumb : 'http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/thumbs/kazvan-2.jpg', url : 'http://www.nonsensesociety.com/2011/04/maria-kazvan/'},  
  66.                                                         {image : 'http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/slides/kazvan-3.jpg', title : 'Image Credit: Maria Kazvan', thumb : 'http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/thumbs/kazvan-3.jpg', url : 'http://www.nonsensesociety.com/2011/04/maria-kazvan/'},
  67.                                                         {image : 'http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/slides/wojno-1.jpg', title : 'Image Credit: Colin Wojno', thumb : 'http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/thumbs/wojno-1.jpg', url : 'http://www.nonsensesociety.com/2011/03/colin/'},
  68.                                                         {image : 'http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/slides/wojno-2.jpg', title : 'Image Credit: Colin Wojno', thumb : 'http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/thumbs/wojno-2.jpg', url : 'http://www.nonsensesociety.com/2011/03/colin/'},
  69.                                                         {image : 'http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/slides/wojno-3.jpg', title : 'Image Credit: Colin Wojno', thumb : 'http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/thumbs/wojno-3.jpg', url : 'http://www.nonsensesociety.com/2011/03/colin/'},
  70.                                                         {image : 'http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/slides/shaden-1.jpg', title : 'Image Credit: Brooke Shaden', thumb : 'http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/thumbs/shaden-1.jpg', url : 'http://www.nonsensesociety.com/2011/06/brooke-shaden/'},
  71.                                                         {image : 'http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/slides/shaden-2.jpg', title : 'Image Credit: Brooke Shaden', thumb : 'http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/thumbs/shaden-2.jpg', url : 'http://www.nonsensesociety.com/2011/06/brooke-shaden/'},
  72.                                                         {image : 'http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/slides/shaden-3.jpg', title : 'Image Credit: Brooke Shaden', thumb : 'http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/thumbs/shaden-3.jpg', url : 'http://www.nonsensesociety.com/2011/06/brooke-shaden/'}
  73.                                                 ],
  74.                                                 
  75.                                                 
  76.                                                 // Theme Options               
  77.                     progress_bar            :   1,          // Timer for each slide                         
  78.                     mouse_scrub             :   0
  79.                     
  80.                 });
  81.             });
  82.             
  83.         </script>
  84.         
  85.     </head>
  86.     
  87.     <style type="text/css">
  88.         ul#demo-block{ margin:0 15px 15px 15px; }
  89.             ul#demo-block li{ margin:0 0 10px 0; padding:10px; display:inline; float:left; clear:both; color:#aaa; background:url('img/bg-black.png'); font:11px Helvetica, Arial, sans-serif;}
  90.             ul#demo-block li a{ color:#eee; font-weight:bold; }
  91.     </style>
  92.  
  93. <body>
  94.     
  95.     <!--Demo styles (you can delete this block)-------------------------------------------------------------------------------->    
  96.     <ul id="demo-block">
  97.         <li><a href="http://buildinternet.com/project/supersized/" target="_blank"><img src="img/supersized-logo.png"/></a></li>
  98.         <li>Photographers: <a href="http://cargocollective.com/mariakazvan" target="_blank">Maria Kazvan</a>, <a href="http://colindub.com" target="_blank">Colin Wojno</a>, &amp; <a href="http://brookeshaden.com/" target="_blank">Brooke Shaden</a></li>
  99.     </ul>
  100.     
  101.     <!--End of styles--->
  102.  
  103.     <!--Thumbnail Navigation-->
  104.     <div id="prevthumb" ></div>
  105.     <div id="nextthumb" ></div>
  106.     
  107.     <!--Arrow Navigation-->
  108.     <a id="prevslide" class="load-item"></a>
  109.     <a id="nextslide" class="load-item"></a>
  110.     
  111.     
  112.     <div id="thumb-tray" class="load-item">
  113.         <div id="thumb-back"></div>
  114.         <div id="thumb-forward"></div>
  115.     </div>
  116.     <!--Time Bar-->
  117.     <div id="progress-back" class="load-item">
  118.         <div id="progress-bar"></div>
  119.     </div>
  120.     
  121.     
  122.     <!--Control Bar-->
  123.     <div id="controls-wrapper" class="load-item">
  124.         <div id="controls">
  125.             
  126.             <a id="play-button"><img id="pauseplay" src="img/pause.png"/></a>
  127.         
  128.             <!--Slide counter-->
  129.             <div id="slidecounter">
  130.                 <span class="slidenumber"></span> / <span class="totalslides"></span>
  131.             </div>
  132.             
  133.             <!--Slide captions displayed here-->
  134.             <div id="slidecaption"></div>
  135.             
  136.             <!--Thumb Tray button-->
  137.             <a id="tray-button"><img id="tray-arrow" src="img/button-tray-up.png"/></a>
  138.             
  139.             <!--Navigation-->
  140.             <ul id="slide-list"></ul>
  141.             
  142.         </div>
  143.     </div>  
  144. <!--Demo styles (you can delete this block)--------------------------------------------------------------------------------------->
  145. <div id="supersized"></div>
  146. </body>
  147. </html>