LazsRealm Of Bloggin

Just a day to day of what's happening with my blog's

Thursday, March 1, 2018

PhotoStack

Photostack.js is ajQuery plugin to create a photo stack effect that allows the users to switch between photos by clicking on the top one.
Share:
Read More

flash-cards


source:3D-Card-Carousel-Rotator-With-jQuery-CSS3

3d Card Carousel Example - Shows 10 flash cards aincluding one with image.
Click Me #9
QUESTION CAN GO HERE

Click Me #7

Click Me #6

Click Me #5

Click Me #4

Click Me #3

Click Me #2

Click Me #1

Click Me #0

Share:
Read More

Wednesday, February 28, 2018

slider-3 HTML




<div style="" id='htmlSlider'><script type="text/javascript" src="http://www.free-web-tools.com/tools/tools.php?id=1004"></script><div id="freewebtools_slider" style="position: relative; width: 425px; height: 540px;"> <div u="slides" style="position: absolute; width: 425px; height: 540px; overflow: hidden;"><div><img u="image" src="http://img.photobucket.com/albums/v106/lazsrealm/maxine/Easter/max-040512.jpg" /></div><div><img u="image" src="http://img.photobucket.com/albums/v106/lazsrealm/maxine/Easter/max-032813.jpg" /></div><div><img u="image" src="http://img.photobucket.com/albums/v106/lazsrealm/maxine/Easter/bf40d6a0-83c8-46e7-a7ae-5776cca2439f.png" /></div><div><img u="image" src="http://img.photobucket.com/albums/v106/lazsrealm/maxine/Easter/max-040312_1.jpg" /></div></div></div><br><span style="font-size:8pt"><a href="http://www.free-web-tools.com/html-slider">HTML Slider</a>&nbsp;Powered by&nbsp;<a href="http://www.free-web-tools.com">Free Web Tools</a></span></div>
Share:
Read More

Saturday, February 3, 2018

Lessons From Grampa

Life lessons my grandfather taught me ...

  • Ah, being young is beautiful, but being old is comfortable.
  • Trouble in marriage often starts when a man gets so busy earnin' his salt that he forgets his sugar.
  • A foolish husband says to his wife, "Honey, you stick to the washin', ironin', cookin', and scrubbin'. No wife of mine is gonna work."
  • Whether a man winds up with a nest egg, or a goose egg, depends a lot on the kind of chick he marries.
  • Too many couples marry for better, or for worse, but not for good.
  • When a man marries a woman, they become one; but the trouble starts when they try to decide which one.

  • If a man has enough horse sense to treat his wife like a thoroughbred, she will never turn into an old nag.
  • How old would you be if you didn't know how old you are?
  • I don't know how I got over the hill without getting to the top.
  • When you are dissatisfied and would like to go back to your youth.... Remember about Algebra.

  • On anniversaries, the wise husband always forgets the past - but never the present.

  • The bonds of matrimony are a good investment only when the interest is kept up.

  • Many girls like to marry a military man - he can cook, sew, and make beds and is in good health, and he's already used to taking orders.

  • Eventually you will reach a point when you stop lying about your age and start bragging about it.
  • The older we get, the fewer things seem worth waiting in line for.
  • Some people try to turn back their odometers. Not me, I want people to know "why" I look this way. I've traveled a long way and some of the roads weren't paved.

  • One of the many things no one tells you about aging is that it is such a nice change from being young.
  • If you don't learn to laugh at trouble, you won't have anything to laugh at when you are old.
  • Old age is when former classmates are so gray and wrinkled and bald, they don't recognize you.

Share:
Read More

Friday, October 27, 2017

marquee

,
.......2....... .......4....... .......6....... .......8.......

Example: source:

Share:
Read More

Sunday, October 1, 2017

jQuoteable




Share:
Read More

Thursday, September 14, 2017

slider-2

A nice easy Javascript Slider with "recent Posts" label showing or whichever is your choice

EXAMPLE::



ORIGINAL CODE:

<!-- BloggerDynamicSlider Basic CSS -->
<style type="text/css">
/**
 *  jQuery BloggerDynamicSlider v1.0.0
 *  Copyright 2016 http://shuvojitdas.com
 *  Contributing Author: Shuvojit Das
 *  Plugin URL: https://github.com/shuvojit33/blogger-dynamic-slider
 *
 */

@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400);
@import url("https://cdnjs.cloudflare.com/ajax/libs/flexslider/2.6.0/flexslider.min.css");

/* Preloader */

.flexslider.loading:after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJA9srgAqPODX3NTIqPezE85V4ktw7bCQK96rPOW_9mZwrjP7xsgAFRAX0eM2GnpZneiTvr1yQv6SzJVB5Jr5wXG6pXls2uuLmtnH4wk_wRcTIrH_02wAHjZbKdd6SMMZHPbmyxRSVuaKv/h120/loader.gif) no-repeat center center;
    background-color: rgba(255, 255, 255, 0.9);
    z-index: 9999;
}

.flexslider.loading ul.flex-direction-nav,
.flexslider.loading ol,
.loading .flex-caption {
    display: none;
}

.flexslider {
    border: 1px solid #cacaca;
    padding: 4px;
    margin: 0 auto 60px auto;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}

.flexslider a {
    text-decoration: none;
}


/* Caption/Post Title */

.flex-caption {
    position: relative;
    padding-left: 15px;
    padding-right: 10px;
    height: 60px;
    background: #FFFFFF;
    color: #1C1C1C;
    font-family: 'Open Sans', sans-serif;
    font-weight: 300;
    font-size: 26px;
    line-height: 26px;
    margin: 0;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
}

.flex-caption span {
    display: table-cell;
    vertical-align: middle;
    height: 60px;
}

.flex-caption.overlayDark,
.flex-caption.overlayLight {
    margin-bottom: -60px;
    bottom: 60px;
    position: relative;
}

.flex-caption.overlayDark {
    background: rgba(0, 0, 0, 0.7);
    color: #fff;
}

.flex-caption.overlayLight {
    background: rgba(255, 255, 239, 0.9);
    color: #000;
}

ul.slides li a {
    display: block;
    overflow: hidden;
}


/* blogger css conflicts fix */

.flexslider ul {
    margin: 0 !important;
    padding: 0 !important;
    line-height: initial !important;
}

.flexslider ul.flex-direction-nav li {
    margin: 0;
    padding: 0;
    line-height: initial;
}

.flexslider ul li {
    margin-bottom: 0 !important;
}

.flexslider img {
    padding: 0;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

ul.flex-direction-nav {
    position: static;
}

ul.flex-direction-nav li {
    position: static;
}

.error {
    font-family: monospace, sans-serif;
}

@media (max-width: 600px) {
    .flex-caption {
        font-size: 20px;
        line-height: 20px;
        font-weight: 400;
    }
}
</style>
<!-- Include Dependency Script -->
<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.0.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/flexslider/2.6.0/jquery.flexslider-min.js"></script>
<script type="text/javascript" src="http://shuvojitdas.com/script/jquery.bdslider.min.js"></script>

<div id="slider2"></div>
<script type="text/javascript">
$(document).ready(function() {
    $("#slider2").BloggerDynamicSlider({
        blogURL: "http://labelpost.blogspot.com/", // Your Blog URL. example: "http://imagesliderforblogger.blogspot.com"
        labelName: "Demo Photo", // Show posts from specific Label. Specify a 'Label', or leave it empty to fetch from all recent posts
        maxItem: 9, // Max number of Slider Posts to show
        showPostTitle: true, // Show post title as Caption ? (true/false)
        postTitleStyle: "overlayDark", // Select post title/caption style "default, "overlayDark" or "overlayLight"
        imageWidth: 704, // Image width in px value
        imageHeight: 440, // Image height in px value
    });
});
</script>


Share:
Read More

slider-1

,
EXAMPLE::

Camera is a responsive/adaptive slideshow. Try to resize the browser window
It uses a light version of jQuery mobile, navigate the slides by swiping with your fingers
It's completely free 
Camera slideshow provides many options to customize your project as more as possible
It supports captions, HTML elements and videos.



I used photos from my Flickr acct https://www.flickr.com/photos/lazsrealm/
Source: bloggerslider.shuvojitdas.com

 CODE::
<!---------------------------------------------
    Blogger Slideshow Widget by
    http://imagesliderforblogger.blogspot.com/
    org. by dimpost.com
----------------------------------------------->
<!--  Camera_Slideshow Styles  -->
<link href="http://project.dimpost.com/camera-slideshow/css/camera.css" id="camera-css" media="all" rel="stylesheet" type="text/css"></link>
<!-- Camera Slideshow Scripts -->
<script src="https://code.jquery.com/jquery-2.1.4.min.js" type="text/javascript"></script>
<script src="http://project.dimpost.com/camera-slideshow/scripts/jquery.mobile.customized.min.js" type="text/javascript"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js" type="text/javascript"></script>
<script src="http://project.dimpost.com/camera-slideshow/scripts/camera.min.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(function() {
    jQuery('#camera_wrap_1').camera({
        time: 4500, // milliseconds between the end of the sliding effect and the start of the nex one
        transPeriod: 1000, // length of the sliding effect in milliseconds
        thumbnails: true, // thumnails & tooltip is controlled by it
        pagination: false, // only when "pagination" is set to "false" thumbnails will be visible
        fx: 'curtainTopLeft, curtainTopRight, curtainBottomLeft, curtainBottomRight, curtainSliceLeft, curtainSliceRight, blindCurtainTopLeft, blindCurtainTopRight, blindCurtainBottomLeft, blindCurtainBottomRight, blindCurtainSliceBottom, blindCurtainSliceTop, stampede, mosaic, mosaicReverse, mosaicRandom, mosaicSpiral, mosaicSpiralReverse, topLeftBottomRight, bottomRightTopLeft, bottomLeftTopRight, bottomLeftTopRight, scrollLeft, scrollRight, scrollHorz, scrollBottom, scrollTop', // transition effects
        hover: false, // Pause on hover
        height: '50%' // slideshow height (50% is default)
    });
});
</script>
<style type="text/css">
.fluid_container {
    margin: 0 auto;
    /* aling centered */
    width: 100%;
    max-width: 900px;
    overflow: hidden;
}


/* Blogger CSS Conflict Fix */

.camera_pag_ul {
    border: none !important;
    background: none !important;
}

.camera_pag_ul li {
    float: inherit !important;
    padding: inherit !important;
}

.camera_pag_ul {
    margin: 0 !important;
    border: 0 !important;
}
</style>
<br />
<div class="fluid_container">
<!-- camera_slideshow camera_wrap-->
    <br />
<div class="camera_wrap" id="camera_wrap_1">
<div data-link="http://www.dimpost.com/" data-src="http://project.dimpost.com/camera-slideshow/images/slides/1.jpg" data-thumb="http://project.dimpost.com/camera-slideshow/images/slides/thumbs/1.jpg">
<div class="camera_caption fadeFromBottom">
Camera is a responsive/adaptive slideshow. <em>Try to resize the browser window</em>
            </div>
</div>
<div data-link="http://www.dimpost.com/" data-src="http://project.dimpost.com/camera-slideshow/images/slides/2.jpg" data-thumb="http://project.dimpost.com/camera-slideshow/images/slides/thumbs/2.jpg">
<div class="camera_caption fadeFromBottom">
It uses a light version of jQuery mobile, <em>navigate the slides by swiping with your fingers</em>
            </div>
</div>
<div data-link="http://www.dimpost.com/" data-src="http://project.dimpost.com/camera-slideshow/images/slides/3.jpg" data-thumb="http://project.dimpost.com/camera-slideshow/images/slides/thumbs/3.jpg">
<div class="camera_caption fadeFromBottom">
<em>It's completely free</em>&nbsp;</div>
</div>
<div data-link="http://www.dimpost.com/" data-src="http://project.dimpost.com/camera-slideshow/images/slides/4.jpg" data-thumb="http://project.dimpost.com/camera-slideshow/images/slides/thumbs/4.jpg">
<div class="camera_caption fadeFromBottom">
Camera slideshow provides many options <em>to customize your project</em> as more as possible
            </div>
</div>
<div data-link="http://www.dimpost.com/" data-src="http://project.dimpost.com/camera-slideshow/images/slides/5.jpg" data-thumb="http://project.dimpost.com/camera-slideshow/images/slides/thumbs/5.jpg">
<div class="camera_caption fadeFromBottom">
It supports captions, HTML elements and videos.
            </div>
</div>
</div>
<!-- #camera_wrap_1 -->
</div>
<!-- .fluid_container -->

<br />
<i><br /></i>
<i><br /></i>
<i>I used photos from my Flickr acct</i> <a href="https://www.flickr.com/photos/lazsrealm/" target="_blank">https://www.flickr.com/photos/lazsrealm/</a><br />
Source:&nbsp;<a href="http://bloggerslider.shuvojitdas.com/2015/12/how-to-add-responsive-slideshow-widget-to-blogger.html" target="_blank">bloggerslider.shuvojitdas.com</a><br />
<b><br /></b>
Share:
Read More

Wednesday, September 13, 2017

daily-image-script

,


Code for Images





<br>
Day of the Year<br>
    
    <script type="text/javascript">
        var now = new Date();
var start = new Date(now.getFullYear(), 0, 0);
var diff = now - start;
var oneDay = 1000 * 60 * 60 * 24;
var day = Math.floor(diff / oneDay);
console.log('Day of year: ' + day);
    </script>
<br>
Day of the Year #2<br>
<script type="text/javascript">
var now = new Date();
var start = new Date(now.getFullYear(), 0, 0);
var diff = now - start + (start.getTimezoneOffset() - now.getTimezoneOffset()) * 60 * 1000;
var oneDay = 1000 * 60 * 60 * 24;
var day = Math.floor(diff / oneDay);
console.log('Day of year: ' + day);
 </script>



<span style="color: #cc0000;">https://www.miniwebtool.com/day-of-year-calendar/</span><br>
<span style="color: #cc0000;">https://www.calendardate.com/todays.htm</span><br>
<span style="color: #cc0000;">Code for Images</span><br>
<script language="JavaScript">

var now = new Date();
var dd = now.getDate();

if (dd==1)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/1.jpg">');
else if (dd==2)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/2.jpg">');
else if (dd==3)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/3.jpg">');
else if (dd==4)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/4.jpg">');
else if (dd==5)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/5.jpg">');
else if (dd==6)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/6.jpg">');
else if (dd==7)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/7.jpg">');
else if (dd==8)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/8.jpg">');
else if (dd==9)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/9.jpg">');
else if (dd==10)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/10.jpg">');
else if (dd==11)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/11.jpg">');
else if (dd==12)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/12.jpg">');
else if (dd==13)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/13.jpg">');
else if (dd==14)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/14.jpg">');
else if (dd==15)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/15.jpg">');
else if (dd==16)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/16.jpg">');
else if (dd==17)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/17.jpg">');
else if (dd==18)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/18.jpg">');
else if (dd==19)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/19.jpg">');
else if (dd==20)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/20.jpg">');
else if (dd==21)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/21.jpg">');
else if (dd==22)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/22.jpg">');
else if (dd==23)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/23.jpg">');
else if (dd==24)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/24.jpg">');
else if (dd==25)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/25.jpg">');
else if (dd==26)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/26.jpg">');
else if (dd==27)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/27.jpg">');
else if (dd==28)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/28.jpg">');
else if (dd==29)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/29.jpg">');
else if (dd==30)
document.write('<img src="http://www.penoxgroup.com/images/galleries/default/30.jpg">');

</script>


https://www.miniwebtool.com/day-of-year-calendar/
https://www.calendardate.com/todays.htm
Share:
Read More

Tuesday, September 12, 2017

Multi-Feed Script

,

/* Multi Feed Loader /www.arlinadzgn.com */


Share:
Read More
Began 2017 by LoriAnn. Powered by Blogger.

Random

Welcome

Welcome

Video