Need help? Check out our Support site, then


Does anyone know what this is for?

  1. Sorry I couldn't think of a better topic title, but I'm getting ready to create a new sandbox design and I noticed a new part of the CSS in sandbox 10. To see whats going on I switched the "display:none"s in the code to "display: show" and doing the same for the "visibility" and it looked like this http://sensico.wordpress.com/files/2009/06/lightwindowoverlay.png

    It seems like it would function as a popup window when I tested it out it popped up whenever I clicked on a new page, youtube video, and a picture that links to an attachment page. I was wondering if anyone else knows how to edit that little box or whats supposed to appear in the mystery popup box or how to add something in there??
    Heres the code

    #lightwindow_overlay {
    	/* REQUIRED */
    	display: show;
    	visibility: show;
    	position: absolute;
    	top: 0;
    	left: 0;
    	width: 100%;
    	height: 100px;
    	z-index: 500;
    	/* REQUIRED */
    }
    
    #lightwindow {
    	/* REQUIRED */
    	/* Of Note - The height and width of this element are set to 0px */
    	display: show;
    	visibility: show;
    	position: absolute;
    	z-index: 999;
    	line-height: 0px;
    	/* REQUIRED */
    }
    
    	#lightwindow_container {
    		/* REQUIRED */
    		display: show;
    		visibility: show;
    		position: absolute;
    		/* REQUIRED */
    		padding: 0 0 0 0;
    		margin: 0 0 0 0;
    	}
    
    	/* IE6 needs this or it messes with our positioning */
    	* html #lightwindow_container {
    		overflow: show;
    	}
    
    	#lightwindow_contents {
    		overflow: show;
    		z-index: 0;
    		position: relative;
    		border: 2px solid #666666;
    		background-color: #f0f0f0;
    	}		
    
    	#lightwindow_iframe {
    		overflow: show;
    	}
    
    #lightwindow_loading {
    	/* REQUIRED */
    	height: 100%;
    	width: 100%;
    	top: 0px;
    	left: 0px;
    	z-index: 9999;
    	position: absolute;
    	/* REQUIRED */
    	background-color: #f0f0f0;
    	padding: 10px;
    }
    
    	#lightwindow_loading_shim {
    		display: show;
    		left: 0px;
    		position: absolute;
    		top: 0px;
    		width: 100%;
    		height: 100%;
    	}
    
    	#lightwindow_loading span {
        	font-size: 12px;
    		line-height: 32px;
    		color: #444444;
    		float: left;
    		padding: 0 10px 0 0;
    	}
    
    	#lightwindow_loading span a,
    	#lightwindow_loading span a:link,
    	#lightwindow_loading span a:visited {
    		color: #09F;
    		text-decoration: none;
    		cursor: pointer;
    	}
    
    	#lightwindow_loading span a:hover,
    	#lightwindow_loading span a:active {
    		text-decoration: underline;
    	}
    
    	#lightwindow_loading img {
       		float: left;
       		margin: 0 10px 0 0;
    	}
    
    /*-----------------------------------------------------------------------------------------------
    	I liked the Navigation so much from http://www.huddletogether.com/projects/lightbox2/
    	I mean let's face it, it works really well and is very easy to figure out.
    -----------------------------------------------------------------------------------------------*/
    
    #lightwindow_navigation {
    	/* REQUIRED */
    	position: absolute;
    	top: 0px;
    	left: 0px;
    	display: none;
    	/* REQUIRED */
    }
    	/* We need to shim the navigation for IE, though its more of a sub-floor */
    	#lightwindow_navigation_shim {
    		/* REQUIRED */
    		display: show;
    		left: 0px;
    		position: absolute;
    		top: 0px;
    		width: 100%;
    		height: 100%;
    		/* REQUIRED */
    	}
    
    	#lightwindow_navigation a,
    	#lightwindow_navigation a:link,
    	#lightwindow_navigation a:visited,
    	#lightwindow_navigation a:hover,
    	#lightwindow_navigation a:active {
    		/* REQUIRED */
    		outline: none;
    		/* REQUIRED */
    	}
    
    	#lightwindow_previous,
    	#lightwindow_next {
    		width: 49%;
    		height: 100%;
    		background: transparent url(../images/blank.gif) no-repeat; /* Trick IE into showing hover */
    		display: block;
    	}
    
    	#lightwindow_previous {
    		float: left;
    		left: 0px;
    	}
    
    	#lightwindow_next {
    		float: right;
    		right: 0px;
    	}
    
    	#lightwindow_previous:hover,
    	#lightwindow_previous:active {
    		background: url(../images/prevlabel.gif) left 15% no-repeat;
    	}
    
    	#lightwindow_next:hover,
    	#lightwindow_next:active {
    		background: url(../images/nextlabel.gif) right 15% no-repeat;
    	}
    
    	#lightwindow_previous_title,
    	#lightwindow_next_title {
    		display: show;
    	}
    
    #lightwindow_galleries {
    	width: 100%;
    	position: absolute;
    	z-index: 50;
    	display: none;
    	overflow: show;
    	margin: 0 0 0 10px;
    	bottom: 0px;
    	left: 0px;
    }
    
    	#lightwindow_galleries_tab_container {
    		width: 100%;
    		height: 0px;
    		overflow: show;
    	}
    
    	a#lightwindow_galleries_tab,
    	a:link#lightwindow_galleries_tab,
    	a:visited#lightwindow_galleries_tab {
    		display: block;
    		height: 20px;
    		width: 77px;
    		float: right;
    		line-height: 22px;
    		color: #ffffff;
    		text-decoration: none;
    		font-weight: bold;
    		cursor: pointer;
    		font-size: 11px;
    		color: #ffffbe;
    		background: url(../images/black-70.png) repeat 0 0 transparent;
    	}
    
    	* html a#lightwindow_galleries_tab,
    	* html a:link#lightwindow_galleries_tab,
    	* html a:visited#lightwindow_galleries_tab {
    		background: none;
    		background-color: #000000;
    		opacity: .70;
    		filter: alpha(opacity=70);
    	}
    
    	a:hover#lightwindow_galleries_tab,
    	a:active#lightwindow_galleries_tab {
    		color: #ffffbe;
    
    	}
    
    	#lightwindow_galleries_tab_span {
    		display: block;
    		height: 20px;
    		width: 63px;
    		padding: 0 7px 0 7px;
    	}
    
    	#lightwindow_galleries_tab .up	{
    		background: url(../images/arrow-up.gif) no-repeat 60px 5px transparent;
    	}
    
    	#lightwindow_galleries_tab .down {
    		background: url(../images/arrow-down.gif) no-repeat 60px 6px transparent;
    	}
    
    	#lightwindow_galleries_list {
    		background: url(../images/black-70.png) repeat 0 0 transparent;
    		overflow: show;
    		height: 0px;
    	}
    
    	* html #lightwindow_galleries_list {
    		background: none;
    		background-color: #000000;
    		opacity: .70;
    		filter: alpha(opacity=70);
    	}	
    
    	.lightwindow_galleries_list {
    		width: 200px;
    		float: left;
    		margin: 0 0 10px 0;
    		padding: 10px;
    	}
    
    	.lightwindow_galleries_list h1 {
    		color: #09F;
    		text-decoration: none;
    		font-weight: bold;
    		cursor: pointer;
    		padding: 10px 0 5px 0;
    		font-size: 16px;
    	}
    
    	.lightwindow_galleries_list li {
    		margin: 5px 0 5px 0;
    		list-style-type: none;
    	}
    
    	.lightwindow_galleries_list a,
    	.lightwindow_galleries_list a:link,
    	.lightwindow_galleries_list a:visited {
    		display: block;
    		line-height: 22px;
    		color: #ffffff;
    		text-decoration: none;
    		font-weight: bold;
    		cursor: pointer;
    		padding: 0 0 0 10px;
    		font-size: 11px;
    	}
    
    	.lightwindow_galleries_list a:hover,
    	.lightwindow_galleries_list a:active {
    		background: #000000;
    		color: #ffffbe;
    		border-left: 3px solid #ffffbe;
    		padding: 0 0 0 7px;
    	}
    
    #lightwindow_data {
    	/* REQUIRED */
    	position: absolute;
    	/* REQUIRED */
    }
    
    	#lightwindow_data_slide {
    		/* REQUIRED */
    		position: relative;
    		/* REQUIRED */
    	}
    
    	#lightwindow_data_slide_inner {
    		background-color: #ffffff;
    		padding: 0 10px 10px 10px;
    	}
    
    	#lightwindow_data_caption {
    		padding: 10px 0 0 0;
    		color: #666666;
    		line-height: 25px;
    		background-color: #ffffff;
    		clear: both;
    	}
    
    	#lightwindow_data_details {
    		background-color: #f0f0f0;
    		padding: 0 10px 0 10px;
    		height: 20px;
    	}
    
    	#lightwindow_data_author_container {
    		width: 40%;
    		text-align: right;
    		color: #666666;
    	 	font-style: italic;
    		font-size: 10px;
    		line-height: 20px;
    		float: right;
    		overflow: show;
    	}
    
    	#lightwindow_data_gallery_container {
    		font-size: 10px;
    		width: 40%;
    		text-align: left;
    		color: #666666;
    		line-height: 20px;
    		float: left;
    		overflow: show;
    	}
    
    #lightwindow_title_bar {
    	height: 25px;
    	overflow: show;
    	color: #CFCFCF;
    	font-size: 12px;
    	font-weight:normal;
    }
    
    	#lightwindow_title_bar_title {
    		line-height: 25px;
    		text-align: left;
    		float: left;
    	}
    
    	a#lightwindow_title_bar_close_link,
    	a:link#lightwindow_title_bar_close_link,
    	a:visited#lightwindow_title_bar_close_link {
    		float: right;
    		text-align: right;
    		cursor: pointer;
    		line-height: 25px;
    		padding: 0;
    		margin: 0;
    	}
    
    	a:hover#lightwindow_title_bar_close_link,
    	a:active#lightwindow_title_bar_close_link {
    		color: #ffffff;
    	}
    
    /*-----------------------------------------------------------------------------------------------
    	Theme styling stuff
    -----------------------------------------------------------------------------------------------*/	
    
    #lightwindow p {
    	color: #000000;
    	padding-right: 10px;
    }

    The blog I need help with is sensico.wordpress.com.

Topic Closed

This topic has been closed to new replies.

About this Topic