Jump to content
php.lv forumi
  • 0

UI dialog


Aiviss
 Share

Question

Tātad šis ir mana Jquery UI doaloga kods. VISS STRĀDĀ (vismaz uz populārākajām pārlūkprogrammām).

Taču vēlētos dzirdēt Jūsu teikumus, kur es feiloju - jo stipri šaubos, ka viss ir OK - 100% kaut ko vismaz var optimizēt.

 

Ja nav grūti pakomentē.

 

       	$(document).ready(function() { 

                                           	// atveram 
                                           	$('#ui').click(function() {

                                               	$('.ui-widget-overlay').fadeIn(300);


                                               	var href = $(this).attr("href");

                                               	var width = $(window).width() / 2;

                                               	var DIVwidth = $(href).width() / 2;


                                                   	$(href).fadeIn(300);   		

                                                   	$(href).css("top","100px");
                                                   	$(href).css("left", width - DIVwidth);

                                           	});



                          					// aizveram
                                           	$('.close').click(function() {

                                               	$('.ui-widget-overlay').fadeOut(300);

                                               	var title = $(this).attr("name");

                                               	$(title).fadeOut(300);

                                           	});



                          					// pogas "Aizvērt" hover
                          					$(".close").hover(

                                               	function () {
                                                 	$(this).css("background","url(images/closeHover.png)");
                                               	},

                                               	function () {
                                                 	$(this).css("background","url(images/close.png)");
                                               	}

                                             	);

});

 

 

<div id="wrap">
   	<a id="ui" href="#kaste">Start kaste</a>


</div><!--wrap -->



<div class="ui-widget-overlay"></div>

<div id="kaste" class="dialog">
   	<div class="close" name="#kaste"></div>

</div>

Edited by Aiviss
Link to comment
Share on other sites

9 answers to this question

Recommended Posts

  • 0

dizains - bet to protams ar CSS noteikt var izmainīt....

 

bet Kāpēc mainīt, ja piemēram mans variants darbojās un ir jau gatavs? (protams, kā jau minēju varbūt mans variants ir nekvalitatīvāks..., ko arī cen\sos noskaidrot...)

Link to comment
Share on other sites

  • 0

Protams, ka dizainu var nomainīt, bet, ja nu grib mācību dēļ apgūt, tad tavs variants ir ļoti šķībs:

1)Ko tu darīsi, ja tev vajadzēs vēl vienu dialogu? rakstīsi visu funkcionalitāti otreiz? Tāpēc vajag veidot OOP stilā, lai funkcionalitāti varētu piešķirt neierobežotam skatiam objektu.

2)jqueryUI ir ļoti labs widget factory, iesaku izmantot to.

Primitīvs piemērs būtu: http://jsfiddle.net/JgMSw/

 

(function($){
   $.widget("ui.mydialog", {
       options:{
           title:"title",
           width:"300px",
           height:"100px"
       },
       _create:function(){
           var self=this;
           var el=this.element;
           el.addClass('ui-widget-overlay mydialog');
           el.width(this.options.width);
           el.height(this.options.height);

           $('<span class="close">close</span>').click(function(){
               self.hide();
           }).appendTo(el);
       },
       hide:function(){
           this.element.hide();
       }
   });
})(jQuery);

$('#d1').mydialog({width:"150px"});


Edited by codez
Link to comment
Share on other sites

  • 0
1)Ko tu darīsi, ja tev vajadzēs vēl vienu dialogu?

 

Jā to tikai pamanīj vēlāk - katrā gadījumā tas ir labots.

 

-----

Rezumējumu ieguvu - lietot jau iebūvēto, ja tas iespējams.

 

Katrā gadījumā - PALDIES!

Link to comment
Share on other sites

  • 0

Personīgi no piemēra, laikam tev tur kopējot strukūra šķībi aizgājusi, kods nav nolikts pakāpeniski viena zem otra, kā nu šis saucās code folding, vai kā tur bija.

 

Nākošais, iekrita acīs tas, ja tu izmanto eng nosaukumus savā kodā, klasēs, tad dari to visur, nevis uzliec kaut kādu #kaste, tad jau labāk uzlikt #block, tā būtu vismaz loģiskāk.

 

Kas attiecās uz JQ UI paku, tad viņa ir samērā smagnēja, lai izveidotu vienu modulāro logu, šaubos vai vajadzētu ķēpāties ar pluginiem, kas visu tikai piegruzī pilnu.

Link to comment
Share on other sites

  • 0

jā tas notika pārkopējot...

---

ņemšu vērā valodu lietojumus - (parasti to ievēroju - šoreiz piemirsās)

---

 

Un kādas tad ir domas par pašu kodu? Viņš kaut kam vispār der - respektīvi - šādu kodu drīkst lietot? (drīkst jāsaprot ar to vai tas ir pilnībā darbspējīgs un spēs savu uzdevumu pildīt vienmēr un visur pie pareiziem apstākļiem... kaut kā tā).

Link to comment
Share on other sites

  • 0

Tāpēc jau tā visa ir programmēšana. Vispār ir jāatcerās, ka tāda ideāla koda, jeb varianta nav, nebūs, nepastāv (tīri teorētiski ņemot).

 

10 koderi šo visu uzrakstītu tā pat pa savam, un tas skaitītos pareizi.

 

Nu ja mēs te sāktu meklēt ideālo variantu visādām lietām, beigās mēs attaptos paši pie sava javascript freimworka.

 

Ja nemaldos biedrs azazul, aka mefisto kaut ko tādu būvēja.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

×
×
  • Create New...