Jump to content


  • Posts

  • Joined

  • Last visited

simplest's Achievements


Newbie (1/7)



  1. Hi, I have just starting doing react and I have the following function which pass 4 values to the API to obtain data objects. let ratesData = getRatesFromDates(startDateRate, endDateRate, baseCurrency, targetCurrency); async function getRatesFromDates(startDate, endDate, baseCurrency, targetCurrency) { try { let response = await fetch('https://api.exchangeratesapi.io/history?start_at=' + startDate + '&end_at=' + endDate + '&symbols=' + baseCurrency + ',' + targetCurrency); let jsonData = await response.json(); return jsonData.rates; } catch(error) { console.error(error); } } console.log(ratesData); In console, these are the data obtained. I am wondering how I can loop through these data to make use and display them on the webpage or pass certain values to other functions?
  2. This example https://www.w3schools.com/howto/howto_css_button_on_image.asp when viewed using iPhone, the button isn't actually centered. Android doesn't have this problem it seems, only browsers in iPhone (tested with Safari and Chrome for iPhone) both shows the button is aligned towards the right side of the div... Attached are screenshots are from my iPhone. Is there a way to fix this? from iPhone Chrome from iPhone Safari
  3. I can do a simple for loops to create a N x N table. However I am not sure how to approach for tables with different colspan in different cells like this?... Any hints or tips on how I should proceed? Thanks in advance. Edit: This is the furthest I can come up with but there is something wrong in it and I am not sure what it is... <html> <style> table { border-collapse: collapse; width: 900px; } th, td { border: 1px solid black; } </style> <?php echo "<table><tr> <td rowspan=\"2\">ID</td> <td rowspan=\"2\">Name</td> <td rowspan=\"2\">Date</td>"; for ($i = 1; $i <= 31; $i++) { echo "<td colspan=\"3\">$i</td>"; } echo "</tr>"; for ($row = 1; $row <=5; $row++) { for ($col = 1; $col <=96; $col++) { echo "<td>" . $col . "</td>"; } echo "</tr>"; } echo "</tr></table>"; ?> </html>
  4. Thanks for the info. I assume this is the limitation of jQuery itself and not a bug?...
  5. Thank for the help @dustcomposer I have changed the # to dot selector and the bullets are gone now. I am still wondering is it possible to have the content box div goes into the sortable list while keeping the styles applied to it?...
  6. I am using jQuery draggable and sortable list the first time and it seems the sortable list is working. However I am having 2 issues: There is this black dot beside the sortable list. Even I add list-style-type: none; to the #sortable CSS but it does not seems to work. When I try to drag the content box below the sortable list to it, the div goes into the list, but loses all the styles. Is this a normal behaviour? Is it possible to keep the style while keep it as a sortable list items? Here is the jsFiddle I put up: https://jsfiddle.net/3fa24d0p/ Thanks in advance.
  7. I have a problem with an image slider code, which seems to work fine in every browsers except Chrome 49. Some of the images aren't display correctly when viewed with Chrome 49. Other versions of Chrome displayed fine however. Here is the link to the slider. I am not sure what is wrong... http://simplest.co.nf/the-team/ Here is the screenshot of how the page rendered in Chrome 48 or lower: http://g05.imgup.net/Windows_7_4014.png Here is the screenshot of the page rendered in Chrome 49. http://a46.imgup.net/Windows_7_b26e.png Does anyone know what is causing the display bug in Chrome 49?
  8. Hi, Thanks for pointing out the mistake. I corrected the code but still seems a bit buggy. Updated Code The regular/normal state is supposed to be the yellow colored square, and the blue one is supposed to be the highlighted state when user is pressing on it.However, after the initial click it changes the order and the blue now become the normal states... Also, it doesn't seems to work in my iphone... Is there something I missed...
  9. Hi dsonesuk, Thanks for pointing out the mistake. I edited my code but it still doesn't seem to work. Here is the fiddler link
  10. HI, Sorry about the title description as I am not sure how I should write it. I am creating a mobile website with an image based navigation menu. Basically. I have created 2 version of the menu item, normal and highlighted version. I am trying to make it so that when user pressing on the icon it will show the highlighted state of the image until the user releases the finger, the image will return to it normal state... I have tried something like this but it doesn't work: <!DOCTYPE html><html><head><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script><script>$(document).ready(function(){ $(".menulink").mouseup(function(){ $(#menu1).attr('src', "<img src="http://placehold.it/333/3ef/img/picture1.jpg" id="bg" />"); }); $("div").mousedown(function(){ $(#menu1).attr('src', "<img src="http://placehold.it/333/fe3/img/picture2.jpg" id="bg" />"); }); $(".menulink").mouseup(function(){ $(#menu2).attr('src', "<img src="http://placehold.it/333/3ef/img/picture1.jpg" id="bg" />"); }); $("div").mousedown(function(){ $(#menu2).attr('src', "<img src="http://placehold.it/333/fe3/img/picture2.jpg" id="bg" />"); });...});</script></head><body><a href="#" title="Switch" class="menulink"> <img src="http://placehold.it/333/3ef/img/picture1.jpg" id="menu1" /></a><a href="#" title="Switch" class="menulink"> <img src="http://placehold.it/333/3ef/img/picture1.jpg" id="menu2" /></a>...</body></html>
  • Create New...