Jump to content

Day

Members
  • Posts

    53
  • Joined

  • Last visited

About Day

  • Birthday 09/26/1989

Previous Fields

  • Languages
    HTML, CSS, JavaScript

Profile Information

  • Location
    Texas
  • Interests
    Web Development, UX Design, Writing, Table Tennis

Day's Achievements

Newbie

Newbie (1/7)

3

Reputation

  1. Well just incase anyone is interested, I thought about it more and changed my approach. To reiterate, the goal was to change specific lines of code with something else based on which subdomain your on. so for example: on www.example.com show "WWW Heading" on sub1.example.com show "Sub 1 Heading" on sub2.example.com show "Sub 2 Heading" the 3 ways I could think of for doing this were: Option 1: create an array for the original string and one for each sub domain: var original = [ 'WWW Heading', 'img/www/img.png'];var sub1 = [ 'Sub 1 Heading', 'img/sub1/img.png'];var sub2 = [ 'Sub 2 Heading', 'img/sub2/img.png']; then looping through them and replacing original with sub1 or sub2. The issue with this approach is that as the number of swaps grows, it could be hard to maintain. The possibility of error grows as the original and the substitutes are separated from each other and tracking which line goes with which could be difficult in a large list. option 2: create an object for each subdomain containing the original and its substitute: sub1 = { 'WWW Heading' : 'Sub 1 Heading', 'img/www/img.png' : 'img/sub1/img.png'}sub2 = { 'WWW Heading' : 'Sub 2 Heading', 'img/www/img.png' : 'img/sub2/img.png'} Then use a for in loop to loop through the sub object and replace property with sub1[property]. The issue with this approach is that I'm repeating the original strings for each sub domain. Option 3 (which I think I'm going to go with): create an array of objects for each original string and it's substitutes: swaps = [ { original: 'WWW Heading', substitutes: { sub1: 'Sub 1 Heading', sub2: 'Sub 2 Heading' } }, { original: 'img/www/img.png', substitutes: { sub1: 'img/sub1/img.png', sub2: 'img/sub2/img.png' } }] Then I loop through the swaps and replace the swaps.original with swaps.substitutes[domain]. This probably isn't the best preforming, but it is much easier to read and maintain.
  2. Hey all, Is there anything wrong with using a string for a object property name/key? for example: var swaps = { 'this' : 'that' } My goal is to create an object containing code that needs to be swapped based on certain conditions and I'd like to avoid having to loop through 2 arrays or objects to find the swap with a matching index. Thanks in advance!
  3. So I've never made retina images or any images that have more than one size, but when I forgot what size favicons were I looked it up and found pages saying to make multi-layered or multi-resolution favicons. I read a few tutorials and most mention using an online tool. That's great, but I'd like to understand more then just how to upload an image to a website and download my .ico file. Can anyone explain how to make multi-layered favicons with Photoshop? Do I just have each size on a separate layer? Do the layers need to follow a specific naming convention? Is this the same way retina images are made? Thank you in advance for any insight!
  4. Oh I didn't test it (I should have) I just assumed I was doing something wrong when it got color coded as a regular expression.
  5. I'm trying to create an equation and would prefer not to split it into different variables. Is there a way to divide twice on the same line and avoid created a regular expression? example: var eq = (5/5)/(5+5); Thanks,
  6. If your looking for a hobby and enjoy coding then PHP/SQL may be the way to go, but if your aim is to get a career than the quickest route is to learn HTML and CSS as Ingolme mentioned. But these skills alone will make it hard to compete in the workforce unless you learn how to design in Photoshop as well.If you really dedicate a solid year to learning HTML, CSS, Photoshop, and best practices, I would then look for a job as a web designer at big corporation. Where I'm from in the states, small agencies will pay web designers $25-$45k/year, but at the big company I work for, they start web designers out at $26/hour (~$54k/year). I've been working here a year and a half and make $32.50/hour. That's $67,600/year which would be £44,855.84/year. Once you get some income to support your new skill set and learning, you can start learning JavaScript and PHP to fulfill your desire to really code. If your looking for a real coding out the gates, I'm probably not the best person to answer. Where I live however, they are always looking for Java Developers and we hire a ton of them locally, and off shore. One perk about the web design field is that I'm often encouraged by my employers to learn more. I go to meet ups, forums, and classes paid for by the employer and the more I learn, the more valuable I become. The more valuable I become, the more I get paid. So I'm getting paid to learn more and get paid more. Whatever you choose, good luck!
  7. Awesome! Thank you. I didn't realize I could use 'this' here. I already had some other functions, activate() and deactivate() for another part that I am reusing. This is what I ended up with: for (i=0; i<_fsMenuItems.length; i++) { _fsMenuItems[i].onclick = activateMenuItem;}function activateMenuItem() { for (i=0; i<_fsMenuItems.length; i++) { deactivate(_fsMenuItems[i]); } activate(this);}
  8. I'm adding onclick events to an array of elements and each one should get the .active class after being clicked. I've got 2 ways to make it work, but can someone help me to understand the difference between the 2? And also let me know if there is a better option? for (i=0; i<_fsMenuItems.length; i++) { // Option 1 (function(index) { _fsMenuItems[index].onclick = function() { _fsMenuItems[index].className += ' active'; } })(i); // Option 2 _fsMenuItems[i].onclick = (function(index) { return function(){ _fsMenuItems[index].className += ' active'; }; })(i);} Thank you!
  9. I'm glad my curiosity led me to open up this thread. Hadien and justsomeguy, you made something that seemed so complicated very simple and easy to understand. Thank you.
  10. While it wouldn't actually watermark your images or stop people from saving the images without the water mark on them, it is possible to place the watermark over top the image by making the following changes: $blog_query = " SELECT blog_id, blog_picture_url, blog_title, blog_message, blog_created_date, blog_edited_date, blog_userid FROM blog ORDER BY blog_id DESC LIMIT 5 "; $blog_result = $mysqli->query($blog_query); // If bigger than 0 if ($blog_result->num_rows > 0) { echo "<div class='home_blog_wrapper'>"; // Wrapper echo "<div class='home_blog_wrapper_inner'>"; // Wrapper Inner echo "<hr />"; // output data of each row while($row = $blog_result->fetch_assoc()) { //echo ""; echo "<div class='home_blog_box_header'>"; // Blog Title echo "<div class='home_blog_box_header_title'>"; echo $row['blog_title']; echo "</div>"; // Blog Number (#) echo "<div class='home_blog_box_header_blog_post'>"; echo "Blog indlæg, #".$row['blog_id']; // Date echo "<div class='home_blog_box_header_blog_date'>"; echo date('d/m/Y H:i:s', strtotime($row['blog_created_date'])); echo "</div>"; echo "</div>"; echo "</div>"; // wrap your images in a div echo "<div class='relativeParent'>"; // images are empty elements so the forward slash stays in the opening tag echo "<img src='".$row['blog_picture_url']."' alt='Blog Billede' title='Blog Billede' />"; // ditto echo "<img class='watermark' src='style/images/img_watermark.png' alt='Vandmærke' title='Vandmærke' />"; // close the wrapping div echo "</div>"; /* echo "<div class='home_blog_image_div_sized'>"; echo "<img class='watermarked' src='".$row['blog_picture_url']."' /><br />"; echo "</div>"; echo nl2br($row['blog_message'])."<br />"; echo $row['blog_userid'].""; */ echo "<hr />"; } echo "</div>"; // Wrapper Inner echo "</div>"; // Wrapper } else { echo "Ingen blog-nyheder er tilføjet i nu!"; } $mysqli->close(); /*# Global Design==================================================*//* Set the position property of the relativeParent div to relative. This will insure that the bottom and right properties of the watermark are relative to the relativeParent div */.relativeParent { position: relative;}img.watermark { /*background-image: url(images/img_watermark.png);*/ height: 40px; width: 40px; position: absolute; bottom: 40px; right: 40px;}.home_news { border-radius: 5px; background-color: #C2C2C2;} .home_blog_wrapper { clear: both; width: 100%; } .home_blog_wrapper_inner { margin: 10px; } .home_blog_box_header { width: 100%; } .home_blog_box_header_title {width: 100%; font-style: normal; font-weight: bold;} .home_blog_box_header_blog_post {text-align: left;} .home_blog_box_header_blog_date {float: right;} .home_blog_wrapper_inner hr {margin-top: 5px; margin-bottom: 5px;}
  11. it looks like the images are already centered in their parent div: "ch-info".
  12. This is true for all web technologies, but take the time to really understand the vocabulary. It helps to better follow any tutorials/explanations and helps when trying to search for answers/resources or ask for help.
  13. Or if you want to keep your js and styles separate. After you get the value you can add a class such as 'greenRow' with a transition property and then remove the class. The transition will create the effect but only in browsers that support it.
  14. What he said ^But on another note. That Twitter logo goes against Twitter's brand guidelines.Might be worth looking in to: https://about.twitter.com/press/brand-assets
×
×
  • Create New...