Νέο jQuery Plugin - Περιμένω γνώμες....

[mixalis8]

Καλησπέρα και χρόνια πολλά,

 

έφαγα έσκασα.... και ετσι μου ηρθε εμπενυση και εφτιαξα αυτό το jquery plugin

 

είναι ένα intro για websites

 

http://www.jquery.gr/introtzikas/

http://plugins.jquery.com/project/introtzikas

 

περιμένω εντυπώσεις και πιθανα bugs....

[wdfgr]

nice one

[Alan Fall]

ωραία ιδέα, θα το δοκιμάσω με την πρώτη ευκαιρία..!

[Crawl_From_Death]

Πολυ ωραιο φιλε μου!

 

Κατι που πρεπει να κοιταξεις...

 

Στον chrome, δειχνει το content της σελιδας, πριν εμφανισει τον preloader (γραμμη που μεγαλωνει). Δεν ξερω αν ισχυει και σε αλλους browsers. Καλο θα ηταν να μην το κανει αυτο. Επιπλεον βελτιστο θα ειναι, οταν εμφανιζεται η γραμμη, το scrollbar να μην ειναι τοσο οσο σε υψος οσο και το περιεχομενο που προκειται να εμφανιστει.

 

Παρολα αυτα, πολυ καλη δουλεια

[παπι]

lol Ειναι τελειο!!

[Haldol]

Καλησπέρα!

 

Πολύ καλή δουλειά με το plugin. Σκέφτομαι να το χρησιμοποιήσω με έναν που μου ζητάει ένα intro τέτοιου τύπου για το site του.

 

 

Για μένα όμως είναι λάθος σου όμως που χρησιμοποιείς το domain jquery.gr μόνο και μόνο για να δείξεις το plugin σου. Θεωρώ πως υπάρχει «ηθική υποχρέωση» εκ μέρους όποιου έχει ένα domain τέτοιου τύπου να προσφέρει στην κοινότητα και όχι να το κρατήσει για τέτοια χρήση. Έχεις έρθει σε επαφή με την ομάδα του jQuery; Με κάποια άλλα άτομα ίσως, που θα ενδιαφέρονταν να συνεισφέρουν για να δημιουργηθεί ένα portal για το framework;

 

 

[Alan Fall]

>(function( $ ){
 $.fn.introtzikas = function(options) {
  
	var defaults = {
		line   : '#F00',
		speedwidth	 : 2000,
		speedheight	 : 1000,
		speedopacity : 800,
		bg : '#333'
	};
	var options = $.extend(defaults, options);
 
 		$('iframe').hide();

	$('body').css('overflow-y','hidden');
	$('<div class="introtzikas_bg"><div class="introtzikas"></div></div>').appendTo('body');

 		$('.introtzikas_bg').css({
	'background-color' : options.bg,
	'position' : 'fixed',
	'height' : '100%',
	'width' : '100%',
	'top' : '0',
	'visibility' : 'visible'
	});
 
	$('body').css('visibility','hidden');
	$('.introtzikas').css({ 
	'background-color' : options.line,
	'position' : 'fixed',
	'top' : '50%',
	'height' : '1%',
	'width' : '0%',
	'visibility' : 'visible'
	});
	
	$('.introtzikas').animate({
		width: '+=100%'
	  }, options.speedwidth, function() {
			$('.introtzikas').animate({
				height: '+=100%',
				top: '-=50%'
			  }, options.speedheight, function() {
					$('body').css('visibility','visible');
					$('.introtzikas_bg').css('visibility','hidden');
					$('.introtzikas').animate({
						opacity: 0
					  }, options.speedopacity, function(){
						  $('.introtzikas_bg').remove();
						  $('iframe').show();
						  
					  });
				$('body').css('overflow-y','visible');

			});
			
	  });
	  
	 
 };
})( jQuery );

 

Έκανα ένα μικρό contribution στον κώδικα:

 

-αφαίρεση δεξιάς μπάρας εάν το content είναι μεγάλο

-αυτόματη δημιουργία division, έτσι δεν χρειάζεται να προσθέσουμε τίποτα στο body για να δουλέψει το script

-Μικρό compression στον κώδικα

 

Ελπίζω να βοήθησε..

 

Όσο αφορά το "spoiler" του haldol, συμφωνώ απόλυτα. Αρχικά νόμιζα πως είναι κάποιο ελληνικό jquery portal και ενθουσιάστικα, στην συνέχεια απογοητευτικά για τους προαναφερθέντες λόγους..

[mixalis8]

Κατ'αρχας ευχαριστώ για την ανταπόκριση.

 

Οσον αφορα τον κώδικα του φίλου, όταν περασει η μέθη θα το κοιτάξω αναλυτικά.

 

Οσον αφορα το domain... έχω σκοπό να το αξιοποιήσω έτσι όπως λέτε, αλλά επειδή ο χρόνος είναι ελάχιστος δεν προλαβαίνω. Και επειδή δεν ήξερα που να βάλω το plugin, το έβαλα εδώ. Το έβαλα και σε φάκελο έτσι ώστε να μην είναι στο route και μελλοντικά να το αξιοποιήσω κατάλληλα.

 

Θέλω να το αναπτύξω περισσότερο τώρα που βλέπω τέτοια ανταπόκριση. Θα το κάνω εκτός από οριζόντια και κάθετα.

 

Και όντως υπάρχει κάποιο bug με τον chrome... αλλά που θα μου πάει.. θα το λύσω.

 

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

[mixalis8]

Λοιπον... κοίταξα τον κωδικα σου φίλε Alan Fall... και μόλις πάω σπιτι θα κάνω καποιες διορθώσεις

 

1) Σωστος με την μπάρα....

2) αυτόματη δημιουργία division δεν θα βάλω... και μαλιστα πρεπει να βαλω και Inline css στον html επειδή ο chrome αργεί να εκτελέσει το jquery και γι'αυτο εμφανίζεται π΄ρωτα το κείμενο και μετά εξαφανίζετε. δυστηχώς πρεπει η html/css πριν απ'ολα να τα απενεργοποιήσει (δεν ειμαι 100% σίγουρος αλλά λογικά έτσι είναι)

3) Θα έχω 2 εκδόσεις... 1 συμπιεσμένη και 1 οχι...

[Alan Fall]

Για ποιά έκδοση του chrome μιλάμε? Στην 10 που το τσέκαρα δεν είχα τέτοιο πρόβλημα..

[Crawl_From_Death]

Εγω το παρατηρω στην εκδοση 10.0.648.204 για windows

[mixalis8]

και εγώ σ'αυτήν....

[Alan Fall]

Εγω στην 5.0375.125 και 10.0.648.205 και δεν είχα πρόβλημα.

 

Όπως και να έχει, παρατήρησα ότι τα 2 div δεν πιάνουν τέρμα αριστερά όλο το viewport, οπότε μέσα στις αλλαγές πρέπει να είναι και η προσθήκη του left: 0 στα 2 div

 

Με αυτή την προσθήκη φάνηκε να βελτιώνεται σε safari και chrome ένα μικρό προβληματάκι που είχε και το animation σαν να κοβώταν απότομα..ρίξτε ένα τσεκ.

 

>
(function( $ ){
 $.fn.introtzikas = function(options) {
  
	var defaults = {
		line   : '#F00',
		speedwidth	 : 2000,
		speedheight	 : 1000,
		speedopacity : 800,
		bg : '#333'
	};
	var options = $.extend(defaults, options);
 
 		$('iframe').hide();
	$('body').css('overflow-y','hidden');
	$('<div class="introtzikas_bg"><div class="introtzikas"></div></div>').appendTo('body');

 		$('.introtzikas_bg').css({
	'background-color' : options.bg,
	'position' : 'fixed',
	'height' : '100%',
	'width' : '100%',
	'top' : '0',
	'left' : '0',
	'visibility' : 'visible'
	});
 
	$('body').css('visibility','hidden');
	$('.introtzikas').css({ 
	'background-color' : options.line,
	'position' : 'fixed',
	'top' : '50%',
	'left' : '0',
	'height' : '1%',
	'width' : '0%',
	'visibility' : 'visible'
	});
	
	$('.introtzikas').animate({
		width: '+=100%'
	  }, options.speedwidth, function() {
			$('.introtzikas').animate({
				height: '+=100%',
				top: '-=50%'
			  }, options.speedheight, function() {
					$('body').css('visibility','visible');
					$('.introtzikas_bg').css('visibility','hidden');
					$('.introtzikas').animate({
						opacity: 0
					  }, options.speedopacity, function(){
						  $('.introtzikas_bg').remove();
						  $('iframe').show();
						  
					  });
				$('body').css('overflow-y','visible');

			});
			
	  });
	  
	 
 };
})( jQuery );

[bullet2D]

Πολύ καλό το plugin, μου αρέσει πολύ, μπράβο! Σκέφτομαι να το χρησιμοποιήσω σε ένα portfolio site.

[antonisid]

πολύ καλή δουλειά!!!! θα το χρησιμοποιήσω σίγουρα!!!