Απορία διατήρησης div στο τέλος

Από που να ξεκινήσω; Που θα βρω; κ.α. γενικές ερωτήσεις για την δημιουργία μιας ιστοσελίδας.

Συντονιστές: WebDev Moderators, Super-Moderators

Απάντηση
ioannisls
Δημοσιεύσεις: 83
Εγγραφή: 11 Ιαν 2012 15:50
Επικοινωνία:

Απορία διατήρησης div στο τέλος

Δημοσίευση από ioannisls » 08 Μάιος 2014 01:25

Κατ' αρχάς για να σας εξηγήσω αυτό που θέλω θα σας δώσω το κώδικα από κάτι άλλο.

Το παρακάτω scipt αυτό που κάνει είναι να κρατάει σε ένα μεγάλο πίνακα το thead στο πάνω μέρος της οθόνης όταν κάνεις scoll down έως να τελειώσει ο πίνακας.

Κώδικας: Επιλογή όλων

<script>
								function UpdateTableHeaders&#40;&#41; &#123;
								   $&#40;".statistika"&#41;.each&#40;function&#40;&#41; &#123;
								   
									   var el             = $&#40;this&#41;,
										   offset         = el.offset&#40;&#41;,
										   scrollTop      = $&#40;window&#41;.scrollTop&#40;&#41;,
										   floatingHeader = $&#40;".floatingHeader", this&#41;
									   
									   if &#40;&#40;scrollTop > offset.top&#41; && &#40;scrollTop < offset.top + el.height&#40;&#41;&#41;&#41; &#123;
										   floatingHeader.css&#40;&#123;
											"visibility"&#58; "visible"
										   &#125;&#41;;
									   &#125; else &#123;
										   floatingHeader.css&#40;&#123;
											"visibility"&#58; "hidden"
										   &#125;&#41;;      
									   &#125;;
								   &#125;&#41;;
								&#125;

								// DOM Ready      
								$&#40;function&#40;&#41; &#123;

								   var clonedHeaderRow;

								   $&#40;".statistika"&#41;.each&#40;function&#40;&#41; &#123;
									   clonedHeaderRow = $&#40;".thead", this&#41;;
									   clonedHeaderRow
										 .before&#40;clonedHeaderRow.clone&#40;&#41;&#41;
										 .css&#40;"width", clonedHeaderRow.width&#40;&#41;&#41;
										 .addClass&#40;"floatingHeader"&#41;;
										 
								   &#125;&#41;;
								   
								   $&#40;window&#41;
									.scroll&#40;UpdateTableHeaders&#41;
									.trigger&#40;"scroll"&#41;;
								   
								&#125;&#41;;
						</script>
<style>
.floatingHeader &#123;
  position&#58; fixed;
  top&#58; 0;
  visibility&#58; hidden;
&#125;
</style>
εν ολίγεις κάτι όπως στα παραδείγματα στο παρακάτω link rommelsantor.com/jquery/thfloat/demo.php

----------------------------------------------------------------------------------------------
Αυτό που θέλω τώρα εγώ

έχουμε ένα div. Και μέσα σε αυτό δύο άλλα. και έχουν τα παρακάτω style

Κώδικας: Επιλογή όλων

#div1 &#123;
height&#58;10000px; 
float&#58; left;
&#125;
#div2 &#123;
height&#58; 2000px;
float;
&#125;
(Στο παραπάνω κώδικα αυτό που θέλω να πω γενικά είναι ότι και τα δύο div έχουν μήκος μεγαλύτερο της οθόνης, και το αριστερό div είναι αρκετά μεγαλύτερο από το δεύτερο.

ΑΥΤΟ ΠΟΥ ΘΕΛΩ:
όταν το τέλος του div2 εμφανίζεται μέχρι να τελειώσει και το div1 να μένει στο πάτο. αυτό

ελπίζω να μη μπέρδεψα .....

Ευχαριστώ εκ των προτέρων

Απάντηση

Επιστροφή στο “Γενικές ερωτήσεις κατασκευής ιστοσελίδων”

Μέλη σε σύνδεση

Μέλη σε αυτήν τη Δ. Συζήτηση: Δεν υπάρχουν εγγεγραμμένα μέλη και 1 επισκέπτης