AlMalalah Posted January 12, 2014 Report Posted January 12, 2014 Am mai multe butoane. Sa zicem ca vreo 25 de butoane ordonate ca o matrice 5 linii x 5 coloane si ca text sunt numerotate de la 1 la 25.Sub butoane am un slider care este setat default pe 100%.Cand dau click cu mouseul pe fiecare buton vreau sa-si schimbe culoare ca si cum as fi selectat anumite butoane din cele 25, sa zicem ca culoarea butoanelor neselectate e galbena iar a celor selectate e verde.Toate aceste butoane sa ramana sub starea de "pressed" si sa aiba culoarea verde.Butoanele selectate astfel vreau sa fie "stocate" undeva intr-un vector ca sa le pot folosi.Mai departe, mut sliderul de la 100% la, sa zicem, 75% si selectez alte butoane ramase neselectate din cele 25 iar ele sa ramana tot asa, pressed si sa isi schimbe culoarea din galben in verde dar mai deschis (75%), nu verde ca cele din grupul de 100%. Si sa le bage intr-un alt vector.Mai departe, mut sliderul de la 75% la o alta valoare si selectez alte butoane, le bag in alt vector, si tot asa.In caz ca selectez un buton care deja face parte dintr-un alt grup atunci sa mi-l scoata din grupul ala si sa-l bage in noul grup.Cum fac chestia asta ?Va rog frumos sa ma ajutati, nu am venit cu nici un cod fiindca nu am nici o idee despre cum sa fac asta.Multumesc mult de tot ! Quote
AlMalalah Posted January 12, 2014 Author Report Posted January 12, 2014 Nici macar markup-ul nu l-ai scris ?<!DOCTYPE html><html><head><style type="text/css">.button_example{border:1px solid #ffc826; -webkit-border-radius: 3px; -moz-border-radius: 3px;border-radius: 3px;font-size:12px;font-family:arial, helvetica, sans-serif; padding: 10px 10px 10px 10px; text-decoration:none; display:inline-block;text-shadow: -1px -1px 0 rgba(0,0,0,0.3);font-weight:bold; color: #FFFFFF; background-color: #ffd65e; background-image: -webkit-gradient(linear, left top, left bottom, from(#ffd65e), to(#febf04)); background-image: -webkit-linear-gradient(top, #ffd65e, #febf04); background-image: -moz-linear-gradient(top, #ffd65e, #febf04); background-image: -ms-linear-gradient(top, #ffd65e, #febf04); background-image: -o-linear-gradient(top, #ffd65e, #febf04); background-image: linear-gradient(to bottom, #ffd65e, #febf04);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#ffd65e, endColorstr=#febf04);}.button_example:hover{ border:1px solid #f7b800; background-color: #ffc92b; background-image: -webkit-gradient(linear, left top, left bottom, from(#ffc92b), to(#ce9a01)); background-image: -webkit-linear-gradient(top, #ffc92b, #ce9a01); background-image: -moz-linear-gradient(top, #ffc92b, #ce9a01); background-image: -ms-linear-gradient(top, #ffc92b, #ce9a01); background-image: -o-linear-gradient(top, #ffc92b, #ce9a01); background-image: linear-gradient(to bottom, #ffc92b, #ce9a01);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#ffc92b, endColorstr=#ce9a01);}</style></head><body><a class="button_example" href="#">1</a><a class="button_example" href="#">2</a><a class="button_example" href="#">3</a><a class="button_example" href="#">4</a><a class="button_example" href="#">5</a><br><a class="button_example" href="#">6</a><a class="button_example" href="#">7</a><a class="button_example" href="#">8</a><a class="button_example" href="#">9</a><a class="button_example" href="#">10</a><br><a class="button_example" href="#">11</a><a class="button_example" href="#">12</a><a class="button_example" href="#">13</a><a class="button_example" href="#">14</a><a class="button_example" href="#">15</a><br><a class="button_example" href="#">16</a><a class="button_example" href="#">17</a><a class="button_example" href="#">18</a><a class="button_example" href="#">19</a><a class="button_example" href="#">20</a><br><a class="button_example" href="#">21</a><a class="button_example" href="#">22</a><a class="button_example" href="#">23</a><a class="button_example" href="#">24</a><a class="button_example" href="#">25</a><br><p>**** Aici trebuia sa fie un slider orizontal de care vorbesc dar nu stiu cum se face in html</p></body></html>Cam asa arata:Ele ar trebui sa formeze un patrat si nu forma aia neregulata. Nu stiu care e chestia.Sub ele ar trebui sa fie acel slider pe care nu stiu cum sa-l fac.Si... cam atat, pana aici ma pricep, de aici va rog mult sa ma ajutati daca se poate si nu va suparati.Multumesc mult de tot ! Quote
eusimplu Posted January 12, 2014 Report Posted January 12, 2014 Nu-ti raspunde nimeni din simplul fapt ca ai atat de multe specificatii incat depaseste limitele cand vine vorba de ajuta pe cineva Quote
AlMalalah Posted January 12, 2014 Author Report Posted January 12, 2014 Nu-ti raspunde nimeni din simplul fapt ca ai atat de multe specificatii incat depaseste limitele cand vine vorba de ajuta pe cineva Poate ca am vorbit eu prea mult insa nu vreau decat un slider si posibilitatea de a selecta unul sau mai multe butoane formand grupuri de butoane selectate cu ajutorul sliderului iar ca sa poti cunoaste fiecare grup sa aibe fiecare cate o nuanta de verde. Atata tot... Quote
Bolovanus Posted January 12, 2014 Report Posted January 12, 2014 nu inteleg ce vrei exact, cum sa formezi grupuri de butoane cu ajutorul sliderului? vrei sa faci ceva in genul Bingo? sau cum? Quote
AlMalalah Posted January 12, 2014 Author Report Posted January 12, 2014 Iti trebuie JavaScript. Altfel nu poti face un slider functional. HTML si CSS iti pun la dispozitie doar elemente de interfata. Functionalitatea este data tot de JS.Atat poti face cu HTML5 dintr-un slider (useless pana apesi submit = bun daca vrei sa faci handling-ul server side): HTML5 Forms: Range Type Demo | WufooTreaba cu butoanele e chiar imposibil de realizat doar cu HTML5.Iar ca sa intelegem, vrei sa selectezi procentul de butoane de pe slider, nu ? Adica daca duci sliderul la 80%, selectezi 20 din 25, nu ?Nu. Misc sliderul la 100% si selectez niste butoane care raman apasate si din culoarea galbena capata culoarea verde 100%.Misc apoi sliderul la 50% si selectez alte butoane care capata culoarea tot verde dar cu 50% mai deschis.Misc sliderul la 35% si selectez alte butoane care vor capata culoarea tot verde dar cu 75% mai deschis (100% e verde maxim - 35% = 75% mai deschis).Misc sliderul la 10% si butoanele pe care le selectez vor o culoare slaba de verde (verde maxim (100%) - 10%(selectat pe slider)=90% mai deschis e verdele.s.a.m.d.Sliderul nu arata procentajul de butoane selectate ci defineste cat de deschisa vor avea culoarea grupul de butoane ce urmeaza sa fie selectat. Quote
EAdrian Posted January 12, 2014 Report Posted January 12, 2014 ceva de genul vrei? http://jsfiddle.net/66JJf/1 Quote
AlMalalah Posted January 12, 2014 Author Report Posted January 12, 2014 ceva de genul vrei? http://jsfiddle.net/66JJf/1Da, dar butoanele sa ramana selectate.Multumesc mult ! Quote