Niemand die een mening heeft over m'n scriptje JSBind?quote:Op woensdag 8 augustus 2012 21:38 schreef FastFox91 het volgende:
Vorige week heb ik even gespeeld met Knockoutjs, maar was uiteindelijk te uitgebreid voor wat ik wilde en kon zelfs iets niet wat ik wel handig vond. Uiteindelijk heb ik zelf dus iets geschreven. JSBind. Probeer de demo en laat weten wat je ervan vindt aub. Met dit scriptje kan je gemakkelijk in javascript variabelen veranderen en vervolgens worden de gekoppelde html elementen ook netjes geüpdatet en visa versa.
(Code is niet erg leesbaar, zal ik verbeteren mocht het gebruikt worden door meerdere mensen.)
#top a, article p, .button { font-size: 1.8em; } zo en dan per kleur, margin of noem maar op.quote:Op vrijdag 10 augustus 2012 10:14 schreef QM84 het volgende:
Wat bedoel je precies met 'een serie selectors'?
De plugin werkt verder wel. Het is alleen de CSS die ik niet juist ingesteld krijg. Mocht het me niet lukken zal ik de autocomplete van jquery ui eens een kans geven.quote:Op dinsdag 14 augustus 2012 12:56 schreef Catch22- het volgende:
Ik kan je hier niet mee helpen; ik zit op mijn werk.
Ik zou trouwens, zonder dat ik de plugin ken, liever gebruik maken van de autocomplete van jQuery ui dan van dit.
quote:Op dinsdag 14 augustus 2012 13:06 schreef schwa78 het volgende:
[..]
De plugin werkt verder wel. Het is alleen de CSS die ik niet juist ingesteld krijg. Mocht het me niet lukken zal ik de autocomplete van jquery ui eens een kans geven.
De site is overigens maar licht NSFW. Zeker wanneer je niet ingelogd bent. Maar goed, ik begrijp het dat je op je werk zit.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | <!-- _________________________ Start Search _________________________ --> <form action="http://www.wecamgirls.com/pages/search.php" method="GET"> <input name="a" value="submit" type="hidden"> <p> <input autocomplete="off" name="search_username" id="search_username" value="enter keywords" type="text"> <div style="display: block; position: absolute; left: 8px; top: 30px; height: 100px; width: 160px;" class="suggestions" id="suggestions_holder"> <div style="width: 160px; overflow: hidden;" id="suggest_row1" class="suggest_item first" seq_id="0"<div class="suggestion_title"><b>Ru</b>tger</div><div class="description"> </div></div> <div style="width: 160px; overflow: hidden;" id="suggest_row2" class="suggest_item" seq_id="1"><div class="suggestion_title">kimbert<b>ru</b>dea</div><div class="description"> </div></div> <div style="width: 160px; overflow: hidden;" id="suggest_row3" class="suggest_item" seq_id="2"><div class="suggestion_title">adriana<b>ru</b>sso</div><div class="description"> </div></div> <div style="width: 160px; overflow: hidden;" id="suggest_row4" class="suggest_item" seq_id="3"><div class="suggestion_title">Holly<b>Ru</b>de</div><div class="description"> </div></div> <div style="width: 160px; overflow: hidden;" id="suggest_row5" class="suggest_item last" seq_id="4"><div class="suggestion_title">johanc<b>ru</b>ijf</div> <div class="description"> </div></div> </div> <input value="" type="submit"> </p> </form> <!-- _________________________ Finish Search _________________________ --> |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 | /* Style For Suggestions */ .sugeestions { z-index:300; position:relative; } .suggestions .suggest_item { padding:2px; background-color:#EEEEEE; border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC; z-index:300; position: relative; } .suggestions .suggest_item.first { border-top:1px solid #CCCCCC; } .suggestions .suggest_item.last { border-bottom:1px solid #CCCCCC; } .suggestions .suggest_item.selected, .suggestions .suggest_item.selected .description { color:#000; font-weight:normal; cursor:pointer; background-color: #DDD; } .suggestions .suggest_item .thumbnail { background-color: transparent; background-position: top center; background-repeat: no-repeat; margin: 1px 2px 1px 2px; float: left; width: 50px; height: 50px; } .suggestions .suggest_item .description{ font-style: italic; font-size: 11px; color: #777; } #header { background:#2d2d2d url(../images/bgs/bg_h_3.png) top left repeat; position:relative; z-index:1; } #container { width:940px; margin:0 auto; position:relative; z-index:1; } |
Ik heb even gekeken en er was wel een een overflow: hidden attribute.quote:Op dinsdag 14 augustus 2012 13:31 schreef QM84 het volgende:
Heeft het element, waar die autocomplete op moet komen, toevallig een wrapper met overflow: hidden? Dat kan er nl ook voor zorgen dat het lijkt alsof je flyout achter de header verdwijnt, terwijl die gewoon afgekapt wordt..
1 2 3 4 | .sugeestions { z-index:300; position:relative; } |
Idd een typo. Helaas niet de oplossing van het probleem.quote:Op dinsdag 14 augustus 2012 14:15 schreef QM84 het volgende:
[ code verwijderd ]
typo? Moet denk ik .suggestions zijn
Je form relative zetten, met een z-index gelijk / hoger dan de header kan ook helpen
http://www.wecamgirls.com/quote:Op dinsdag 14 augustus 2012 14:24 schreef QM84 het volgende:
hmm.. heb je ergens een voorbeeld online staan? Dat zoekt wat makkelijker
Koning!quote:Op dinsdag 14 augustus 2012 14:29 schreef QM84 het volgende:
Het zit hem in je div.header_top. Deze heeft een overflow: hidden.
Deze heb je daar waarschijnlijk aan meegegeven, omdat de layout kapot gaat als je hem weghaalt. Dit komt weer door de float: right op de ul.header_list erin.
Als je de header_top fatsoenlijk cleart (google: clearfix), dan komt het helemaal goed. Je kan hem evt ook een vaste hoogte meegeven.
Hij doet het!quote:
Bronquote:Op dinsdag 14 augustus 2012 22:24 schreef Quotidien het volgende:
Maar wat ik niet snap ik dat een CMS-site duurder is dan een website gemaakt met HTML/CSS, terwijl een CSM website veel makkelijker te maken is? Of zie ik dit verkeerd?
Googleresultaten.quote:
Forum Opties | |
---|---|
Forumhop: | |
Hop naar: |