wongadob

Is this possible? With 31 people reading this and no replies makes me worry that it can't be done?

Once again dsonesuk, you have saved my bacon. You Genius ! Thanks a million I have been trying to figure this out off and on for days! The margin-top -50 fixed it perfectly

Hi I am trying to position an element above another element. the element I want to position is a red blob that indicates there are notififctions to read in my system. I have a menu bar that has 5 icons on it. Each is 20% screen width. To save having lots of code here I have just included 1 element. All 5 are almost exactly the same (different icon art and id's is only difference). The issue I am getting is that the blob is appearing where I want it to, but it seems the system is allocating space for it below the icon bar. I have attached a simplified view of what is happening. The white bar between the green icon bar and the gray bar is where the problem lies. This white bar is exactly the same height as the red blob (20 pixels) and if I did not offset the position by -50 then it would sit here. But since I have offset the object by -50 and given it a higher z-index. Why is it still allocating here. I cannot use a fixed positon for 2 reasons, firstly earlier devices do not support fixed positioning and secondly there are many different screen resolutions. Joys of mobile dev. All I need to do is to lose this white bar. Please could you take a look at my HTML (as I say only show 1 div of 5 which are all the same across the screen) and CSS and let me know what I am doing wrong. Thanks in anticipation HTML <div class="relative_div"> <a ontouchstart="touchStart()" ontouchend="touchEnd(event,this)" onclick = "initNotifications()" > <img id = "icon-note" src = "art/newheader/notification_off.png" alt = "Notifications" onmouseover = "setMouseOverIconNote()" onmouseout = "setMouseOutIconNote()"/> </a> <div id = "unreadbox_notifications"><span class = "unread_box"></span> </div> </div> CSS .relative_div {width:20%;text-align:center;float:right;}.unread_box{position: relative;top:-50px;z-index: 500;width: 20px;height:20px;float:right;background-color: #ff0000;opacity:0.8;color: white;border-radius:10px;margin-right: 20%;}#unreadbox_notifications{visibility: hidden;} PS I should state that the following ID's are modified by jQuery and do not have any CSS icon-note - This is modified to show versions of the icon required.unreadbox_notifications is switched on or off dependant on if there are notifications.

I have a password entry box and I am trying to display the character that the user has entered. I am aware of the jQuery pluggin dpassword which replicates the iphone input, but I need a little more control. I have the system pretty much working based on another solution. However the one thing I need to know is how to find out the screen Top, Left position of the carat. Any ideas how I can get this. I have seen solutions that give you the character index into the text area, but I need the screen position as I want to display the currently entered character immediately infront of the last character. I am sure there must be some way of finding this out. even if it is just relative to the start of the password entry box (as I am sure I can get that's Top Left co-ordinate. Thanks for the help Wongadob

Hi, I would like some advice and recommendation on Web File servers. I am in the process of creating a site (I am a bit of a newbie, but want to realise my idea before presenting and getting investment to re-engineer the right way. (if I dont get it right myself) I am a reasonably experinced programmer, mainly low level assemblty languages, C,, Javascript, PHP. I am less experienced in server side technologies. I have created software from scratch using XAMPP written in PHP and accessing a MY-SQL server, but what I am planning is a lot grander. I plan on having a master mysql server to store user infromation that then points to other servers that will store that particular users data. A lot of this data will be again SQL databases, I know I can handle that bit, but the bit I have not done before and I am usure about is the storage of users files. i.e. jpg's etc. They will have the ability to upload picture and video files. I know I need to store these on a file server that is independant of the SQL server, but what I don't know if the technology to use for a file server. What software should I be using for a file server. bare in mind I am familiar with Xampp in a WAMP set-up. I want something that is SUPER robust. I know I may need to change solurtions in the future if this takes off, but I don't want that transition to be too painful (as we all know the pace the web moves if it takes off. I think I have my architecture OK for server expansion, but need a tech that will allow me to set up multiple file servers if necessary. Any advice would be much appreciated. Regards

Thanks that worked fine once i got the Id. I had to find the Id first as the listener was on the body element

Is there any way in jQuery or Javascript that you can detect if the current focused/activce element is a textarea or input area. The reason for this is I need to use hotkeys but they will be standard keys (i.e. not control+key) so I need to do a key listener and then make it ignore the keypress and fall through if the user is inputting text. I can do this by testing the ID for the ID's of all mt inputs/textareas, but that seems to be a tad long winded. Be great if there was something like $(document).currentactiveID But can't seem to find anything As always any help much appreciated

These are both on a blackberry. Some models have touch and focus! So I need to handle both simultaneously

for the record I have to solve this by leaving both in but then setting a flag in the function that gets executed, then putting a timed callback to clear the flag. So any calls to the same function within 2 seconds would not get called. This works for me becuase if somebody wanted to legitimately send again they would have to create a new message and then send and the chances of doing that witthin 2 seconds is extremely unlikely. For the record here is the code if (!stopDoubleSend){ stopDoubleSend=true; setTimeout(function(){stopDoubleSend=false},2000); the code for the function follows the set Timeout and only gets called if stopDoubleSend is false

I could not use onfocus, because it uses focus based navigation. i,e you move around the screen in the same way tab would work so when something is in focus it is not seleted it just highlights a cursor. The select state is triggered by a click. However mixed with that you face the touch screen technology that also has to work at the same time. This tech needs the item to be 'clicked' immediately when it is tocuhed. In normal touch tech mode the first touch highlights the element then the second touch selects (clicks) it. I need to do both of these simultaneously. I have tried using onmousedown, which should work for both, but sadly it does not and in the latest BB library release notes it state that onmousedown does not work. So I am stuck trying it that way. I was hoping there might be a simple way to say only accept an event once for this element.

Also I tried onmousedown in the hope it would catch both. It caught the ontouchstart, but not on the click. BTW click on blackberry in navigation mode is pressing the scrollwheel or trackpad.

Sadly they don't that is the point. If I just had onclick. Then the ontouchstart event has 2 stages. The first stage is to set the focus on the item. The second 'touch' would trigger the actual event. But the client wants the first touch to be the only touch and trigger the event. Hence me trying to force a click.

Hi I have a bit of HTML (infact I use this all over the place) that needs an onclick and an ontouchstart, but having both is causing double entry of the data. I need touchstart to work as a full click. The software I am writing is for the blackberry the normal functionality of touch has been disabled as I do not want any guestures, or scrolling or anything else. Just leaving in the onclick means the user has to press the screen twice. once to move the focus to the object, then the second time to 'click the object'. I need just a single press to execute the element. So in my HTML I am using doing the following <div id = 'enterbutton' class = 'basic_button' x-blackberry-focusable="true" x-blackberry-onDown=""; onmouseover="highlight_basic(this);" onmouseout="unhighlight_basic(this);" ontouchstart="triggerClick(this);" onclick="postThreadMessage()">Submit</div> The code for the ontouchstart function is as follows:- function triggerClick(el){ $(el).trigger('click');} So it is simulating a click. I have tried changing the ontouchstart fucntion to call the same function call as onclick, but get the same results. Is there any command that informs the system to only trigger one event per element. or any sugggestions how to get around this. Any help much appreciated.

Somebody must know an answer to this surely. I would have thought it would be a common test even on desktop PC's

I ended up completely changing the approach. I guess the blackberry tags do not necessarily utilise the 'this' I decided to not send any parameters and then when getting to the function I request what object is in focus which gives me the id. Not pretty and I am sure structrurally nasty, but got to get the thing done Thanks for your help

I am writing a web app on a blackberry and I am trying to prevent the user from navigating off a text area using the scroll wheel. If they have touch and want to leave via that method, that is up to them, but I want to prevent scroll off upwards (you can scroll off below to the submit button) This may seem a complete Noob question, but how do I detect the status of the text area. if the user has not started typing, and it is just highlighted but not selected, then they can go where they like. If it has been selected, then I would like to only allow them to submit or cancel. Thanks

This does not seem to be an issue with knockoutjs as I created a seprate project really cut back and get the same result. The entire code is this <!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta name="viewport" id="viewport" content="target-densitydpi=high-dpi,initial-scale=1.0,user-scalable=no" /> <title>DummyTest</title> <script type="text/javascript">function navDown(el){console.log(el);}</script></head><body><div><ul> <li><div id="item1" x-blackberry-focusable="true" x-blackberry-initialFocus="true" x-blackberry-onDown="navDown(this)" onmouseover="this.style.backgroundColor='#2070d0'" onmouseout="this.style.backgroundColor='transparent';" >item 1</div></li> <li><div id="item2" x-blackberry-focusable="true" onmouseover="this.style.backgroundColor='#2070d0'" onmouseout="this.style.backgroundColor='transparent';" >item 2</div></li> <li><div id="item3" x-blackberry-focusable="true" x-blackberry-onDown="navDown(this)"onmouseover="this.style.backgroundColor='#2070d0'" onmouseout="this.style.backgroundColor='transparent';" >item 3</div></li> <li><div id="item4" x-blackberry-focusable="true" onmouseover="this.style.backgroundColor='#2070d0'" onmouseout="this.style.backgroundColor='transparent';" >item 4</div></li> <li><div id="item5" x-blackberry-focusable="true" x-blackberry-onDown="blackberry.focus.setFocus('item1')"onmouseover="this.style.backgroundColor='#2070d0'" onmouseout="this.style.backgroundColor='transparent';" >item 5</div></li></ul><div></body> And the output is still a big chunk of code and not the dom element object I was expecting. Is there anything I am doing wrong, calling convention wise??

Yes I thought that but it does not appear to. The first line of my function I put a console.out and ended up getting a function & code printed out to the console, rather than what I was expecting an object? Any other ways?

I am trying to pass the ID of an element to a javascript function. Easy you think, but not in this instance. I am using knockout.js and from my experiments it woud appear that the ID does not exist yet. This is the element I am trying to get the ID of <div class = "messageitem" x-blackberry-onDown="navDown(this.id)" x-blackberry-focusable="true" onmouseover="this.style.backgroundColor='#cceeff';setScrollTop(this.id);" onmouseout="this.style.backgroundColor='#ffffff';" data-bind = "click: showthread.bind($data, thread()), attr: { 'id': 'th_mb' + $index()"> This is the function I am trying to call with the id x-blackberry-onDown="navDown(this.id)" However when retreiving it in JS the callig parameter is undefined. Now the reason I think this is happening is becuase the ID does not exist at the point the HTML is created and is only later created when the Knockoutjs item template is updated. See the data bind where it is setting the attribute ID to th_mb+$index(). this creates th_mb0, th_mb1 etc etc so a unique ID is created per element that is added the the Knockout View model. I assume that when the initail HTML is created (this.id) does not actually have an Id, and only later when the view model is updated is the Id created. Any idea how I can send the element to the function, not the element ID. I tried using. navDown(this) but this seems to send the function x_blakcberry-onDown to the JS function. I assume becuase the 'this' is the function. Any ideas how I can send the DOM element. and I guess when I get the DOM element. how do you access the Id. is it purely element.id ? Any help much apprecaited

Thanks Justsomeguy, I just figured that out a few mins ago the fact that it had a [0] index. Damn it that had me for hours!

BTW this is where the array/object is created. Note that NoteCache is passed to this function as feed var noteCache=new Array();noteCache.push({notifications: new Array(),references: new Array(),objects: new Array(),meta: new Array() });

I have tried using the combinations of .notifications and ['notifications'] I believe they are interchangeable, but I have tried all combinations and still I am getting this. It is really doing my head in as I cannot see anything wrong. Anybody know any reason why this might be happening

I have an object defined called feed. I have these two lines of code console.log (feed);console.log (feed['notifications']);var notes = feed.notifications.length-1; In Chrome debugger I am getting this - Object is feed [ Object meta: Array[0] notifications: Array[0] objects: Array[0] references: Array[0] __proto__: Object ] main.js:1714</p>undefined main.js:1715 Uncaught TypeError: Cannot read property 'length' of undefined

OK so made that change and do difference <div class = "messageitem" x-blackberry-focusable="true" onmouseover="this.style.backgroundColor='#880000';" onmouseout="this.style.backgroundColor='#ffffff';" data-bind = "click: showthread.bind($data, thread())"> <div class="picture" data-bind="html: picurl"></div> <div class="textpart"> <div class="mi_name" data-bind = "click: initMemberProfile.bind($data, userID())" x-blackberry-focusable = "true" onmouseover = "this.style.color='#444444'; this.style.backgroundColor='#ff0000'; this.parentNode.parentNode.style.backgroundColor='#00ff00';" onmouseout = "this.style.color='#16509e'; this.style.backgroundColor='transparent'; this.parentNode.parentNode.style.backgroundColor='#880000';"> <p data-bind = "text: user"></p> </div> <div data-bind = "html: readicon" ></div> <div class = "groupline" data-bind="html: viagroup"></div> same deal the main message always stays highlighted.

Ah never noticed the ones on messageitem.