Fork me on GitHub
LSF

Long Shadow Function

Long Shadow Function is a function in PHP to generate long shadows both for typography and boxes. Here ar the two Long Shadow Functions: text_shadow & box_shadow:

Copy code
<?php // TEXT SHADOW function text_shadow( $total, $color ) { $ts = 'text-shadow:'; $first = true; for( $i = 0; $i < $total; $i++ ) { if( !$first ) { $ts .= ', '; } else { $first = false; } $ts .= $i.'px '.$i.'px 0 #'.$color; } echo $ts.';'; } ?>
Copy code
<?php // BOX SHADOW function box_shadow( $total, $color ) { $prefix = array( '', '-webkit-', '-moz-', '-o-' ); $bs = ''; for( $j = 0; $j < count($prefix); $j++) { $ts = $prefix[$j].'box-shadow:'; $first = true; for( $i = 0; $i < $total; $i++ ) { if( !$first ) { $ts .= ', '; } else { $first = false; } $ts .= $i.'px '.$i.'px 0 #'.$color; } $bs .= $ts.';'; } echo $bs; } ?>

Finally you only have to call the function you desire:

Select code
<div style="<?php text_shadow( $length, $color ); ?>"> Lorem Ipsum </div> <div style="<?php box_shadow( $length, $color ); ?>"></div>

Example:

Select code
<div style="<?php text_shadow( 1000, 'f0f0f0 ); ?>"> Lorem Ipsum </div> <div style="<?php box_shadow( 2000, 'f5f5f5' ); ?>"></div>

PS: You can set up overflow as hidden to cut the long shadow for the text and for the box you must put some content inside or set the width and height of the box

Did you find this feature useful? Share it!

Tweet

Did you find me interesting? Follow me!


Follow @mononelo
Google+
Follow

mononelo @ Barcelona 2017