Author Topic: Parking Elements (Read 2398 times)

Jason Knight · « **Reply #15 on:** 29 Oct 2020, 09:44:05 am »

Insomnia sucks, especially with non-24 sleep wake disorder. I'll probably be "jet-lagged' by halloween.

Ok, let's do this. First a simple HTML to show what I'm talking about:

Code: [Select]

<!DOCTYPE html><html lang="en"><head><meta charset="utf-8">
<link
	rel="stylesheet"
	href="parking.screen.css"
	media="screen,projection,tv"
>
<title>Parking Demo</title>
</head></body>

<h1>Parking Demo</h1>

<div id="garage">

	<h2>Garage</h2>
	
	<section>
		<h3>Fourth Section</h3>
		<div>
			<p>
				Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare pretium luctus. Morbi sed sodales mi, non dictum ligula. Aliquam condimentum nulla diam, sit amet placerat tortor condimentum sit amet. Vivamus vestibulum lorem leo, a venenatis augue bibendum vitae. Suspendisse blandit et massa vitae pellentesque. Nunc dictum congue erat, ut volutpat odio euismod ac. Maecenas dapibus rhoncus urna sit amet imperdiet.
			</p>
		</div>
	</section>

<!-- #garage --></div>

<div id="lot">

	<h2>Lot</h2>

	<section>
		<h3>First Section</h3>
		<div>
			<p>
				Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare pretium luctus. Morbi sed sodales mi, non dictum ligula. Aliquam condimentum nulla diam, sit amet placerat tortor condimentum sit amet. Vivamus vestibulum lorem leo, a venenatis augue bibendum vitae. Suspendisse blandit et massa vitae pellentesque. Nunc dictum congue erat, ut volutpat odio euismod ac. Maecenas dapibus rhoncus urna sit amet imperdiet.
			</p>
		</div>
	</section>
	
	<section>
		<h3>Second Section</h3>
		<div>
			<p>
				Aenean sed nibh elementum, efficitur ligula non, elementum quam. Aenean elementum odio sed lorem mollis, elementum commodo ligula vestibulum. Nullam non ante maximus, ultrices sapien a, vulputate est. Mauris et est ac nisl consectetur dictum tincidunt eget felis. Curabitur eros orci, efficitur vel volutpat quis, tempus non nisl. Nullam aliquam vestibulum malesuada. Sed id arcu quam. Phasellus dapibus cursus libero tempus lobortis. Phasellus in sapien lobortis, rhoncus urna vitae, ultricies ante. Curabitur et consequat diam. Ut magna massa, lobortis sed ullamcorper nec, tincidunt sed lacus. Phasellus commodo sem et ex semper pellentesque. Etiam suscipit semper lectus, ac facilisis lacus tempus vitae. Pellentesque aliquam tortor non arcu tempor mollis. Donec quis sapien nec erat egestas lacinia.
			</p>
		</div>
	</section>
	
	<section>
		<h3>Third Section</h3>
		<div>
			<p>
				Mauris nec aliquet nisl. In hac habitasse platea dictumst. In a turpis in mauris pharetra vehicula in vel nisi. Maecenas non sollicitudin lacus, a bibendum ipsum. Phasellus commodo lobortis erat, a consequat ante accumsan et. Proin pulvinar malesuada sapien, at sodales dui ullamcorper sed. Fusce elementum nulla vitae dui semper venenatis. Phasellus nec augue tincidunt, interdum felis egestas, lobortis odio.
			</p>
		</div>
	</section>

<!-- #lot --></div>

<script src="parking.js"></script>

</body></html>

No excess classes, no dicking around with javascript in the markup where it has ZERO blasted clue being, no scripting only elements pissing on the markup, and let's put a "parked' section in the "garage" and three in the "lot". (I figured if we're gonna use the terminology, let's use it!)

The scripting?

Code: [Select]

(function(d) {
	
	var
		lot = d.getElementById("lot"),
		garage = d.getElementById("garage");
	
	for (var section of d.querySelectorAll("#lot > section, #garage > section")) {
		var button = section.appendChild(d.createElement("button"));
		button.className = "togglePark";
		button.onclick = togglePark;
		button.textContent = "toggle";
		button.type = "button";
	}
	
	function togglePark(event) {
		var section = event.currentTarget.parentNode;
		(section.parentNode.id == "lot" ? garage : lot).appendChild(section);
	} // togglePark
	
})(document);

That's it. In hindsight, tempted to rename "togglePark" to "valet"

For now rather than your fa-icon I just put the text "toggle" inside it.

CSS handles the rest. #garage section > div { /* hide it here */ }, same for the

Here's a live demo.

https://cutcodedown.com/for_others/durangod/parking/parking.html

As with all my examples the directory is wide open:

https://cutcodedown.com/for_others/durangod/parking/

For easy access to the bits and pieces.

The event handler is something of a masterpiece. By detecting the outer DIV's id, we can figure out where it is and where to move it as a one-liner. Donja just love how "appendChild" and/or "insertBefore" also does a "removeChild" if the node is already attached somewhere? I've actually been redoing my "list and table sorting" routines to leverage that. Never occurred to me that it works even when the target is the existing parent.

So for example:

Code: [Select]

test.appendChild(test.firstElementChild);Will actually move the first element in a container to the end.

Anyhow, look over what I've done, if you have questions, just ask.

durango_d · « **Reply #16 on:** 29 Oct 2020, 03:13:28 pm »

Thanks so much, yeah i have trouble with sleep as well. It will take some time to do some console logging so that i understand this and yeah ill ask if i have quesitons. I am hoping i can just slide this right inside of my drag N drop with no issues. Ill work on this today.... thanks again , hope u get some rest.

Jason Knight · « **Reply #17 on:** 29 Oct 2020, 11:38:47 pm »

Well now that I'm awake, let me break down that script for you. By now you know what a IIFE is and how it isolates scope... so let's talk about the two var.

Code: [Select]

	var
		lot = d.getElementById("lot"),
		garage = d.getElementById("garage");

I store references to the two parking areas at the start so that inside the event handler we aren't doing getElementById over and over. getElement(s)By(whatever) and QuerySelector(all) are slow operations, so the less we need to do them the better. It's better to do them once, than for every blasted event.

Some of the pedantic "functional programmer" types will see that and start running their mouths about "side effects" -- a bad incorrect and misleading name for a duplicitous and idiotic bunch of effete career educator bullshit. We're in a IIFE, it's 2k of scripting, WE'RE FINE!

Code: [Select]

	
	for (var section of d.querySelectorAll("#lot > section, #garage > section")) {

We only use the nodeList once for this loop, so there's no reason to waste a variable on it. For/of makes the syntax a lot cleaner... just beware it doesn't work in IE. OH WELL!

Code: [Select]

		var button = section.appendChild(d.createElement("button"));
		button.className = "togglePark";
		button.onclick = togglePark;
		button.textContent = "toggle";
		button.type = "button";

Making the button is pretty straight forward. Thankfully appendChild returns the appended child, so we can just wrap the append to save a bit of code. Normally I would say use Element.addEventListener instead of Element.onclick so that if other events are present they can co-exist, but in this case we literally just created the element, so there are no other handlers to worry about. I set type="button" so that clicking on it does nothing, meaning we don't need to "Event.preventDefault" inside our event handler.

The event handler:

Code: [Select]

	function togglePark(event) {
		var section = event.currentTarget.parentNode;
		(section.parentNode.id == "lot" ? garage : lot).appendChild(section);
	} // togglePark

Is pretty simple. I store the parent node of the button (our section) in a variable because it sucks to have that twice in the code. Usually I'd rail against the variable for nothing, but being a double-deep object lookup pointing at an object, in this case err on the side of clarity.

If the sections' parent is the lot, we want to move it to the garage, otherwise it's not in the lot so move it to lot. We just choose which obect inside a parenthetical using a ternary operation, and boom we have the object to append the section to. Again, appendChild also doing a removeChild from any existing location is very handy.

With "lot" and "garage" having ID's from there everything else can be CSS controlled, declare what's common between both locations, then declare with a leading #lot or #garage what's unique to each.

durango_d · « **Reply #18 on:** 30 Oct 2020, 01:09:11 am »

Thank you for explaining, it helps alot.. what is the syntax if i want to appendChild to the h3 instead of just section. The icon/button needs to be a child of the h3 so i can put them on the same line.

I know they were on the same line to begin with but i added a div because i need them to be listed vertically in its own scroll box, and the button on the same line..

i got alittle of it by adding h3 to the selectorAll but i dont know the syntax for the rest of it to use the h3, i add h3 but it says h3 is not defined..

What im looking for is that i want the Title and the mouse icon seperate from the rest inside the garage, so i added a div inside garage called parked_items and it has a scroll bar.

here is where i added the h3

Code: [Select]

	
	
	for (var section of d.querySelectorAll("#lot > section h3, #parked_items > section h3")) {
		var button = section.appendChild(d.createElement("button"));

i am also assuming that this is ternary in js

Code: [Select]

(section.parentNode.id == "lot" ? garage : lot).appendChild(section);

the issue now is that it looks great in the parking garage but when i toggle back to lot it gets separated from the section and they all end up down below the sections, so basically the lot boxes have no h3 to them, just the text. I did test the togglePark function with console.log and its corrrect, it shows section as h3

Maybe rather than explain (since i have a hard time doing that) ill just show you the end result...

Here is what i am trying to do.. Here is a video i made before i changed things, thats exactly what im looking for in the parking and the drag n drop... although i admit my drag n drop i think has a bug in it as you can see by the video, that box didnt fit so well when i dropped it into an strange place.

I think the best thing for me to do is to get the parking done first, then ill work on fixing my drag n drop issue. I think the drag n drop might mean i have to add a "Event.preventDefault" but im not sure yet until i put it together. Actually what happened in the video there is that there are two sep divs, one upper for the large item and one lower for the other smaller boxes, i tried to drop it in the large div, and it is not a bug, it did what it should have done, stuck to the top of its own div... So maybe ill make it so the large div cant be resized.. not sure yet...

Also its only asthetics that it seems in the video that im having to click on the mouse icon, i could actually click anywhere on the box to drag it , i dont know why i kept holding the mouse icon lol

So i guess the first thing is how do i get this to the h3 element, i think thats what i need.

Too bad you dont have a video bbcode, here is the link.

https://www.youtube.com/channel/UCyxILQ_HoQOPUDC9kPGqi9Q?guided_help_flow=3

durango_d · « **Reply #19 on:** 30 Oct 2020, 05:38:22 am »

Yeah ok i think i see whats happening.... when i console log inside togglePark for
section.parentNode.id it goes back and forth from lot to parked_items... so its placing it in the lot rather than inside the div where the text is, thats why they all show up on the bottom of the lot... so now i need to try to see what i did to cause that..

maybe i need to give the nameless div an id and point the toggle there

Jason Knight · « **Reply #20 on:** 30 Oct 2020, 05:41:51 am »

You don't need to do all that to make them go vertical, literally just pull the flex of the garage.

One sec, I'll change the example to that. Done.

The new CSS goes:

Code: [Select]

#garage, 
#lot {
	padding:0.5em;
	margin-bottom:1em;
	background:#EEE;
	border:1px solid #0004;
}

#garage {
	max-width:30em;
}

#lot {
	display:flex;
	width:100%;
	flex-wrap:wrap;
	align-items:stretch;
	justify-content:center;
	background:#DEF;
}

#garage h2,
#log h2 {
	flex:1 0 auto;
	width:100%;
	padding:0.33em 0.66em;
	font-size:1.5em;
}

#lot section,
#garage section {
	position:relative;
	margin:0.5em;
	background:#FFF8;
	border:0.0625em solid #0004;
}

#lot section {
	flex:1 0 20em;
	max-width:30em;
}

#garage section > div {
	position:absolute;
	top:-999em;
	left:-999em;
}

#garage h3,
#lot h3 {
	/* right side padding makes room for button */
	padding:0.2em 5em 0.2em 0.8em;
	font-size:1.25em;
	background:#0482;
}

#lot h3 {
	margin-bottom:0.8em;
	border-bottom:0.05em solid #0004;
}

#lot p {
	padding:0 1em 1em;
}

.togglePark {
	position:absolute;
	top:0.4em;
	right:1em;
	margin-top:-1px;
	padding:0.1em 0.5em;
	background:#080;
	color:#EFE;
	border:0;
	border-radius:0.5em;
	transform:scale(1);
	transition:transform 0.3s;
}

.togglePark:focus,
.togglePark:hover {
	outline:none;
	transform:scale(1.1);
}

Literally just pulled the flex and re-arranged the specificity.

To move them to an inner DIV for wrapping, I'd suggest moving the ID to the target inner DIV instead of playing with trying to walk to it.

As to the drag and drop, that usually the type of fragile junk in terms of layout I'd say just avoid. Such things never actually drag to/from -- at least inside the same container -- where the user expects or wants. I'm not sure what implementation you're using for it, but the lack of visual queues as to where it's going to insert isn't helping matters.

And yeah, they will go to the bottom, that's what appendChild does. Keeping track of their original positions or orders is a whole slew of separate work.

durango_d · « **Reply #21 on:** 30 Oct 2020, 06:02:25 am »

Ok trying it now... thanks

So that is a problem if i cant drag n drop, those are the specs i have to meet for the users, they specifically requested that feature... I know its not a perfect feature but i need to give them something in that direction.

And the position memory and order, well that too is something that was requested.. They dont want to have to move stuff around each time they log in, or refresh the page.

For the position and order i was working with this rough code draft...
https://forums.cutcodedown.com/index.php?topic=341.0

and for the drag n drop, you showed me something over on the other site but i have not played with it yet. So for now im still using this and of course ill need to change var names for the new lot names.

The first code is for the (aka lot) section DND and the second code is for just the parking section with 4 wide and i background color when i grab it to show them the space where they can drop it.

Code: [Select]


I think it works well enough to be a base model, at least its something i can offer them that is half way decent, even if the feature in general thinking is rubbish... 

 
 /* all activity boxes other than parking */
 /* parking is a separate process on this same page */
 
 const dropitems = document.querySelectorAll('.feedwrapper, .newswrapper'); // all div boxes inside the small and large container class
 const droparea  = document.querySelectorAll('.gridcontainer, .newsgridcontainer'); // the whole area including all the div boxes big and small

 let draggedItem = '';  /* null; dont use null it will display null on the page */
 
 for(let i=0; i < dropitems.length; i++)
 {
    
     const item = dropitems[i];
     
     
     item.addEventListener('dragstart', function() 
     {
        
        draggedItem = item;
        
        setTimeout(function() 
        {
            
         item.style.display = 'none';
            
        }, 0); 
     });
     
     item.addEventListener('dragend', function() 
     {
       
        setTimeout(function() 
        {
            
          draggedItem.style.display = 'block';
          draggedItem = null; 
            
        }, 0); 
     });
     
     /* the above code is for grabbing and moving object */
     
     
     
     
     /*  the below code is for placing and letting go of object */
     
     for(let j=0; j < droparea.length; j++)
     {
         
         const list = droparea[j];
         
          
         list.addEventListener('dragover', function(e) 
         {
             e.preventDefault();
         }); 
         
         list.addEventListener('dragenter', function(e) 
         {
             e.preventDefault();
         }); 
         
         list.addEventListener('drop', function(e) 
         {
            this.append(draggedItem);
            
         });
         
      }//close for let j
     
 }//close for let i
 
 
 
 /* for parking only   */
 
 const dropParkitems = document.querySelectorAll('.parking, .parkbar_contentA, .parkbar_contentB, .parkbar_contentC'); // all the divs inside the container
 const dropParkarea  = document.querySelectorAll('.parkContainer'); //the container area

 var pc = document.getElementById('parkContainer');

 let draggedParkItem = ''; /* null;  done use null it will display null on the page  */
 
 for(let k=0; k < dropParkitems.length; k++)
 {
    
     const parkitem = dropParkitems[k];
     
     
     parkitem.addEventListener('dragstart', function() 
     {
         
         /* here we set the background alittle darker on grab to give the user */
         /* a heads up on where the drag area is */
         
        pc.style.background="#9d9a9a"; /* lt grey */
         
        draggedParkItem = parkitem;
        
        setTimeout(function() 
        {
         parkitem.style.display = 'none';
            
        }, 0); 
     });
     
     parkitem.addEventListener('dragend', function() 
     {
       
        setTimeout(function() 
        {
            
          draggedParkItem.style.display = 'block';
          draggedParkItem = null; 
            
        }, 0); 
     });
     
     /* the above code is for grabbing and moving object */
     
     
     
     
     /*  the below code is for placing and letting go of object */
     
     for(let p=0; p < dropParkarea.length; p++)
     {
         
         const parklist = dropParkarea[p];
         
          
         parklist.addEventListener('dragover', function(e) 
         {
             e.preventDefault();
         }); 
         
         parklist.addEventListener('dragenter', function(e) 
         {
             e.preventDefault();
         }); 
         
         parklist.addEventListener('drop', function(e) 
         {
            this.append(draggedParkItem);
            
            /* we have to set the background back to normal after release */
            pc.style.background="#d2cbcb"; /* off white */
            
         });
         
      }//close for let p
     
 }//close for let k

durango_d · « **Reply #22 on:** 30 Oct 2020, 06:13:15 am »

you have a typo in css, should be lot

#garage h2,
#log h2 {
flex:1 0 aut

//and in the saved html version you had a close body instead of an open body

<title>Parking Demo</title>
</head></body>

ok so by this

Quote

To move them to an inner DIV for wrapping, I'd suggest moving the ID to the target inner DIV instead of playing with trying to walk to it.

ok i just did this and it worked...

Code: [Select]

	garage = d.getElementById("parked_items");

and

Code: [Select]

<div id="garage">

	<h2>Garage</h2>
	
	<div id="parked_items">
     <section>
		<h3>Fourth Section</h3>
		<div>
			<p>
				Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare pretium luctus. Morbi sed sodales mi, non dictum ligula. Aliquam condimentum nulla diam, sit amet placerat tortor condimentum sit amet. Vivamus vestibulum lorem leo, a venenatis augue bibendum vitae. Suspendisse blandit et massa vitae pellentesque. Nunc dictum congue erat, ut volutpat odio euismod ac. Maecenas dapibus rhoncus urna sit amet imperdiet.
			</p>
		</div>
     </section>
    </div><!-- #parked_items -->

</div><!-- #garage -->

and

Code: [Select]

#parked_items {
    max-width: 16.50em;
    max-height: 5em;
    background-color: #b1b1b2;
    color: #000000;
    padding: 0.50em;
    overflow-y: auto;
    overflow-x: hidden;
    resize: none;
}

it wont let me use the unicode for the parking icon inside the css so i just did this
i changed the class togglePark to an id in the css and then use the font awesome class in the js like so

Code: [Select]


	        button.type = "button";
		button.className = "fas fa-parking";
		button.id = "togglePark"; 	
		button.onclick = togglePark;

One thing for sure using this method, there wont be anymore just tossing in some html and walking away, as adding almose anything else thats a major element will screw up the js...

as cool as it is, its also very restrictive...

durango_d · « **Reply #23 on:** 30 Oct 2020, 08:51:34 am »

Ok i think i got it from here... i am happy with the outcome finally... just have to get some colors on it to match the theme and add the DND stuff...

It seems to be working well, thank you for all your assistance and patience with this... you have been very kind to assist me...

one final question: how did you hide the text content div and p on parking, i can see it via the console but its not there in the garage... i assume since we did not assign it, its there but just not displayed... is that correct?

Jason Knight · « **Reply #24 on:** 30 Oct 2020, 10:52:25 am »

It's in the CSS:

Code: [Select]

#garage section > div {
	position:absolute;
	top:-999em;
	left:-999em;
}

When our sections are in #garage, take any DIV that are direct children of it, and hide them off screen. I hide them off screen with absolute positioning so that screen readers and search engines that obey screen media (when they shouldn't) don't ignore the content. When possible, avoid display:none on anything that's actually content. It can be ignored, or worse get you penalized for "content cloaking".

Probably doesn't matter for your activity panel, but it's a good practice to just get into.

durango_d · « **Reply #25 on:** 31 Oct 2020, 12:28:25 am »

Thats a pretty neat little css trick.... very cool....

I did add this to the togglePark, ill use your var name for the example, which just show the text of Empty if its empty... ill come up with a nicer text or maybe an icon of some kind for asthetics...

Code: [Select]

		if( $('#garage:empty').length )
		{
		   	var t = garage.appendChild(d.createElement("span")); 
		   	t.className = "lite";
		   	t.textContent = "Empty";
		}

and then to turn it red when parked, inside the togglePark function

Code: [Select]

	if(section.parentNode.id == "garage")
		{
		  section.childNodes[5].id="togglePark_red"; 
		}

and then just copied the togglePark css and changed the color to red.

I know im far from quite there, but i feel i learned alot with your help.... thanks

durango_d · « **Reply #26 on:** 31 Oct 2020, 03:44:30 am »

Hi,
when you have some time can you log in and have a look at the site so you can see whats happening..

what i did was i added that text that shows that the parking is empty. I have all the logic done but i am missing the tail end of the cycle some how and i have tried several times and im not seeing it.

When the page first loads its fine, the parking is empty and it shows the text "Parking Is Empty"

when i move something from the lot to the garage, the text goes away, perfect!!!

the problem is when i leave the garage each time with togglePark i check to see if the value is "lot" and if it is "lot" then i check to see if the garage is empty, and if so then turn the "Parking is Empty" text back on. This is the part that is not working. And i cant seem to see where im missing the boat here.

here is the css

Code: [Select]

.parking_notempty {
    display: none;
}

.parking_empty {
    color: #ffffff;
    display: block;
}

.parking_empty:hover {
    text-shadow:0 0 0.1em #0ad63a;
}

and the js

Code: [Select]

 (function(d) {
	
	var
		lot = d.getElementById("lot"),
		garage = d.getElementById("parked_items");
		
	var t = garage.appendChild(d.createElement("span"));
	    t.className="parking_empty";
	   	t.textContent = "Parking Is Empty";
		
	
	for (var section of d.querySelectorAll("#lot > section, #garage > section")) {
		var button = section.appendChild(d.createElement("button"));
		button.type = "button"; /* remember default is submit */
		button.className = "fas fa-parking";
		button.id = "togglePark";
		button.title = "Park Me";  //<?= htmlspecialchars(getLangValue('FEED_PARK_WORD_TEXT')); ?>";
		button.onclick = togglePark;
		
	}//close the for
	
	function togglePark(event) {
		var section = event.currentTarget.parentNode;
		(section.parentNode.id == "lot" ? garage : lot).appendChild(section);
		
		
		/* when we append to parked_items */
		
		if(section.parentNode.id == "parked_items")
		{
		  section.childNodes[5].id="togglePark_red"; 
		  section.childNodes[5].title="UnPark Me";
		  
		  /* turn off the parking empty text */
		  /* no longer empty */
		   t.className="parking_notempty";
		  
		  //console.log(t);
		  
		}//close if parked_items
		
		
		
		
		/* when we append back to the lot */
		
		if(section.parentNode.id == "lot")
		{
		  section.childNodes[5].id="togglePark"; 
		  section.childNodes[5].title="Park Me";
		  
		  if( $('#parked_items:empty').length )
		  {
		  
		     if(t.className == "parking_notempty")
		     {
		       t.className="parking_empty"; 
		      }
		  
		   }//close if parked_items empty
		  
	     }//close if lot
	     
	     
	
		  //TODO LIST
		  //add dragable code 
		  //set draggable to false on park and true on unpark
		  //and remove drag icon on park and show it on unpark
		
	} // close togglePark
	
})(document);

i thought i was trapping event correct when the last item left, but i guess not...

durango_d · « **Reply #27 on:** 31 Oct 2020, 04:18:04 am »

You know this is the first time i have realized that with toggles in console you can watch the html change when you toggle... i have never noticed that before... so with that i see that its not triggering my code on the last item...

And then the duh moment... im checking for empty but its not empty, it will never be empty, it has a span inside it regardless..... no wonder it did not work...

Now i have to figure out how to check it in a different way that is reliable...

UPDATE: got it.... ill check the length of the garage.childNodes

Code: [Select]

                  if( garage.childNodes.length == 1 )
		  {
		      
		     if(t.className == "parking_notempty")
		     {
		       t.className="parking_empty"; 
		      }
		  
		   }//close if garage.childNodes

Jason Knight · « **Reply #28 on:** 31 Oct 2020, 06:21:14 am »

length is actually a "slow" operation, it may be faster to simply check if there is a firstElementChild.

Code: [Select]

if (garage.firstElementChild) { /* if there's a first child, it must have children! */
Though I'm wondering what/why you seem to think you need to check that and set a class.

durango_d · « **Reply #29 on:** 31 Oct 2020, 10:26:47 am »

Thanks,

Are you suggesting a static text instead would be better which would forego the checking all together?
I do like that idea alot, however i just tried it, it looks good, but it would require another line and i dont have enough room even with tiny text unless i expand the block, and i dont want to make it any taller than it is... and it would look bad on the same line as the h3

As to the way im doing it now and the reason i have to check that... how else am i going to toggle the text, i need to have some kind of comparitive value.

CUTCODEDOWN
Minimalist Semantic Markup

Author Topic: Parking Elements (Read 2398 times)

Jason Knight

Re: Parking Elements

durango_d

Re: Parking Elements

Jason Knight

Re: Parking Elements

durango_d

Re: Parking Elements

durango_d

Re: Parking Elements

Jason Knight

Re: Parking Elements

durango_d

Re: Parking Elements

durango_d

Re: Parking Elements

durango_d

Re: Parking Elements

Jason Knight

Re: Parking Elements

durango_d

Re: Parking Elements

durango_d

Re: Parking Elements

durango_d

Re: Parking Elements

Jason Knight

Re: Parking Elements

durango_d

Re: Parking Elements

Advertisement

Login

Author Topic: Parking Elements (Read 2398 times)

Advertisement