working on it ...

Filters

Explore Public Snippets

Sort by

Found 163 snippets matching: divs

    public by zonaro modified Oct 23, 2015  2411  1  6  0

    Placeholder for DIVs

    Create a placeholder for divs with ContentEditable, just put the placeholder text into data-placeholder attribute
    [contentEditable=true]:empty:not(:focus):before {
               color: #ACACAC;
               content: attr(data-placeholder);
           }

    public by UriahsDev modified May 30, 2015  1841  1  4  0

    This effects could be applied on divs also not just entire pages

    This effects could be applied on divs also not just entire pages: js_fade_effects
    http://git.blivesta.com/animsition/
    
    

    external by Felix Descoteaux modified Jan 11, 2015  6  0  1  0

    Function for jquery to set divs to the same height, using the max height of those divs.

    Function for jquery to set divs to the same height, using the max height of those divs.: sameheight.js
    //Author: Felix Descoteaux
    //Usage: $.sameheight($("#element1"), $(".element2"), ... );
    
    (function($) {
        var sameHeight = function sameHeight() {
            var arrayOfHeights = [],
                arr = Array.prototype.slice.call(arguments),
                max;
    
            //Clear any height value
            arr.forEach(function(e) {
                e.height("");
            });
    
            //Push outerHeight in array
            arr.forEach(function(e) {
                arrayOfHeights.push(e.outerHeight());
            });
    
            //Set max
            max = Math.max.apply(null, arrayOfHeights);
    
            //Set css
            arr.forEach(function(entry) {
                entry.css({
                    position: "relative",
                    height: max
                });
            });
        };
    
        //Set function
        $.sameHeight = sameHeight;
    
    })(jQuery);
    
    

    external by Aaron John Schlosser modified Sep 5, 2014  114  0  2  0

    Breaks an ACF field into two divs of evenish columns

    Breaks an ACF field into two divs of evenish columns: ACF_make_two_columns
    <?php
    
    /**
           * 
           * Breaks an ACF field into two divs of evenish columns
           *
           * @author Aaron John Schlosser <aaron@aaronschlosser.com>
           * @link https://gist.github.com/ajschlosser/daf17648f0f42d1597ec#file-acf_make_two_columns
           * @copyright Copyright 2014 Aaron John Schlosser
           * @license http://www.gnu.org/licenses/gpl-2.0.html GPLv2
           * @param string $field  The ACF field name (e.g., "about_content")
           * @param array $params  Array containing all other parameters (optional)
           * @param string $class  The desired class to be added to each of the column divs (optional)
           * @param string $delimiter  The delimiter used to break up ACF field content into an iterable array (optional)
           * @param string $tag  Which HTML tag to surround the new paragraphs in (optional)
           * @return null
           */
    function acf_make_two_columns ($field, $params=null, $class="large-6 columns", $delimiter="<br />", $tag="p") {
    	if ($params && count($params) > 0) {
    		if ($params["class"]) $class = $params["class"];
    		if ($params["delimiter"]) $delimiter = $params["delimiter"];
    		if ($params["tag"]) $tag = $params["tag"];
    	}
    	$a = explode($delimiter, get_field($field));
    	$l = count($a);
    	$n = strpos($tag, " ");
    	$open_tag = $tag;
    	if ($n === false) {
    		$n = strlen($tag);
    		$close_tag = "</".substr($tag,1,$n-1);
    	} else $close_tag = "</".substr($tag,1,$n-1).">";
    	$total_length = 0;
    	for($i = 1; $i <= $l; $i++) {
    		$total_length += strlen($a[$i]);
    	}
    	$first_half_length = 0;
    	$second_half_length = 0;
    	$second_half_index = 0;
    	$done = false;
    	echo "<!--Begin Automatically Generated Columns. Attempting to divide ".$l." paragraphs into two columns each with a class of 'columnize ".$class."'.--><div class='columnize ".$class."'>".$open_tag.$a[0].$close_tag;
    	for($i = 1; $i <= $l; $i++) {
    		if (!$done) {
    		$first_half_length += strlen($a[$i]);
    		if ($first_half_length < ceil($total_length/2)) {
    			echo $open_tag.$a[$i].$close_tag;
    		}
    		else {
    			echo $open_tag.$a[$i].$close_tag;
    			$done = true;
    			$second_half_index = $i;
    			$second_half_length = $total_length - $first_half_length;
    		}
    		}
    	}
    	echo "</div><div class='columnize large-6 columns'>";
    	if ($second_half_index > 0) {
    		for($i = $second_half_index; $i <= $l; $i++) {
    			echo $open_tag.$a[$i].$close_tag;
    		}
    	} else {
    		echo "There was a problem splitting the ACF field into two even columns. Sorry!";
    	}
    	echo "</div><!--End Automatically Generated Columns.-->";
    	return null;
    }
    
    ?>
    
    

    external by dlukes modified Feb 3, 2016  91  0  1  0

    A stretchy div between other divs on one line.

    A stretchy div between other divs on one line.: stretchy_div.html
    <!-- How to have a div stretch between divs on the left and right. Useful e.g. for -->
    <!-- Bootstrap navbar et al. -->
    <style>
    .inner-navbar {
      border: 2px solid black;
      padding: 5px;
      width: 100%;
    }
    
    .left {
      float: left;
    }
    
    .red{
      border: 2px solid red;
    }
    
    .green{
      border: 2px solid green;
    }
    
    .blue{
      border: 2px solid blue;
    }
    
    .right{
      float: right;
    }
    </style>
    <div class="inner-navbar">
      <div class="red left">Red</div>
      <div class="green left">green</div>
      <div class="green right">green</div>
      <!-- this last div is the one that won't float and will be stretched -->
      <div class="blue">blue</div>
    </div>
    
    
    

    external by dacur modified Oct 9, 2014  57  0  1  0

    Get the value of a Div (from a row of Divs that were clicked) that was dynamically created. See notes in code below.

    Get the value of a Div (from a row of Divs that were clicked) that was dynamically created. See notes in code below.: getValue.js
                $('.catRow').on('click', function(){
                    var catEditing = $(this).html(); //All divs in row
                    var catName = $(catEditing).closest('.catName').text();
                    alert(catName);
                })
                
    For example, you are dynamically creating rows of data that are given from the DB.
    Each row is clickable.
    To find the Name (catName; i.e. 'category name') of the clicked row, use this code!
    
    

    external by axiomaticdesign modified Jun 1, 2015  57  0  1  0

    Have 3+ radio buttons that correspond to additional infomation/form elements. The value of each radio button corresponds to a div in the #grounds_more div. This hides all visible divs, then shows the desired one. Toggle doesn't cut it for 3+ items.

    Have 3+ radio buttons that correspond to additional infomation/form elements. The value of each radio button corresponds to a div in the #grounds_more div. This hides all visible divs, then shows the desired one. Toggle doesn't cut it for 3+ items.: radioToggleMultiple.js
    $("input[name='grounds']:radio").change( function () {
        var val, obj;
        
        val = $(this).val();
        obj = $('#' + val);
        
        $("#grounds_more > div:visible").fadeOut(300, function () {
            obj.fadeIn(300);
        });
    });
    
    

    external by Ricky Ruhlen modified Sep 29, 2016  45  0  1  0

    resize divs so they have the same height.

    resize divs so they have the same height.: resize.js
    <script>
      
      function adjustBoxes() {
      $('.desk-topic').height("auto");
      var elementHeights = $('.desk-topic').map(function() {
      return $(this).outerHeight();
      }).get();
      var maxHeight = Math.max.apply(null, elementHeights);
      $('.desk-topic').height(maxHeight);
      }
      
      $(function() {
      
      $(window).on('resize', function(){
      adjustBoxes();
      });
      
      adjustBoxes();
      
      });
    </script>
    
    

    external by cheralynnadal modified Jan 22, 2015  45  0  1  0

    Individual loop count with divs

    Individual loop count with divs: gistfile1.php
    <?php
    
    // check if the repeater field has rows of data
    if( have_rows('rep_test') ):
    
    	$counter = 1;
     	// loop through the rows of data
       
        while (have_rows('rep_test')):{the_row();}
        
        if ($counter % 2 == 0) {
    	
    		echo ('<div id="section2">');
    			echo ('<div class="container">');
    				echo ('<div class="template-page content  av-content-full alpha units" style="border:none;">');
    					echo ('<div class="flex_column av_one_third first  avia-builder-el-8  el_before_av_two_third  avia-builder-el-first  ">');
    						echo ('<div class="avia-image-container  av-styling-  avia-builder-el-9  avia-builder-el-no-sibling  avia-align-center " itemscope="itemscope" itemtype="https://schema.org/ImageObject">');
    							echo ('<div class="avia-image-container-inner">');?>
    								<?php $image = get_sub_field('image'); if( !empty($image) ): ?>
    								<img src="<?php echo $image['url']; ?>" class="avia_image " alt="<?php echo $image['alt']; ?>" />
    								<?php endif; ?><?php
    							echo ('</div>');
    						echo ('</div>');
    					echo ('</div>');
    					
    					
    								echo ('<div class="flex_column av_two_third   avia-builder-el-10  el_after_av_one_third  avia-builder-el-last  ">');
    									echo ('<div class="TeamText">');
    									echo ('<h2>');
    									echo the_sub_field('name');
    									echo ('</h2>');
    									echo ('<h3>');
    									echo the_sub_field('jobtitle');
    									echo ('</h3>');		
    									echo ('<p>');
    									echo the_sub_field('info');
    									echo ('</p>');
    								echo ('</div>');
    				echo ('</div>');
    			echo ('</div>');
    		echo ('</div>');
    	echo ('</div>');
    
        	
        	
    	}else{	
    	
        	echo ('<div id="section1">');	
        		echo ('<div class="container">');
    				echo ('<div class="template-page content  av-content-full alpha units" style="border:none;">');
    					echo ('<div class="flex_column av_two_third first  avia-builder-el-1  el_before_av_one_third  avia-builder-el-first  ">');
    						echo ('<div class="TeamText">');
    							echo ('<h2>');
    							echo the_sub_field('name');
    							echo ('</h2>');
    							echo ('<h3>');
    							echo the_sub_field('jobtitle');
    							echo ('</h3>');		
    							echo ('<p>');
    							echo the_sub_field('info');
    							echo ('</p>');
    						echo ('</div>');
    					echo ('</div>');
    		
    							echo ('<div class="flex_column av_one_third   avia-builder-el-5  el_after_av_two_third  avia-builder-el-last  ">');
    								echo ('<div class="avia-image-container  av-styling-  avia-builder-el-6  avia-builder-el-no-sibling  avia-align-center " itemscope="itemscope" itemtype="https://schema.org/ImageObject">');
    									echo ('<div class="avia-image-container-inner">');?>
    										<?php $image = get_sub_field('image');
    										if( !empty($image) ): ?>
    										<img src="<?php echo $image['url']; ?>" class="avia_image " alt="<?php echo $image['alt']; ?>" />
    										<?php endif; ?><?php
    									echo ('</div>');
    								echo ('</div>');
    							echo ('</div>');
    				echo ('</div>');
    			echo ('</div>');
    		echo ('</div>');		
    	}
    	
    	
    	$counter += 1;
        endwhile;
    	
    	else:
    
        // no rows found
    
    	endif;
    	
    ?>
    
    
    

    external by fieldoffice modified Jun 25, 2014  34  0  1  0

    Randomise a group of divs

    Randomise a group of divs: randomise
    $(document).ready(function() {
    	
    	$('.rdm').hide();
    
    	var elements = $('.rdm');
    	var elementCount = elements.size();
    	var elementsToShow = 5;
    	var alreadyChoosen = ",";
    	var i = 0;
        	while (i < elementsToShow) {
            	var rand = Math.floor(Math.random() * elementCount);
            		if (alreadyChoosen.indexOf("," + rand + ",") < 0) {
                		alreadyChoosen += rand + ",";
                		elements.eq(rand).show();
                	++i;
            	}
        	}
    	
    });
    
    
    • Public Snippets
    • Channels Snippets