Jump to content


  • Posts

  • Joined

  • Last visited

Posts posted by Day

  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. 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!

  5. 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);}
  6. 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!

  7. 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;}
  8. Nothing's over the top when you're learning. Please post the code for what you have in mind so we don't have to guess.


    I don't have much to contribute without seeing the code first, but just wanted to point out how true a statement this is. Nothing is over the top when you're learning.


    I held myself back for a while because I always felt like everything I tried was the wrong/hard way (over the top) and it was very discouraging. The only way I was able to finally start excelling was to just make things work however I could, then go back later and see if there was a better way. The more solutions you can come up with, the better you'll be at problem solving.

  9. I have a script that is using cloneNode to add fieldsets to a form. After I use cloneNode, I'm attempting to search through the new node's children to change id attributes, however nextSibling is returning an empty text node instead of the fieldset.After the first one is cloned, the and I clone the second, nextSibling begins to return a fieldset. Im not sure why the first one won't work.Can anyone offer some insight?

  10. Try replacing your link styles with this:
    #carousel ul li a.slider_title {  background: rgba(0,0,0,.7);  color: #fec700;  text-align: center;  font: normal 13px Oswald;  display: inline-block;  padding: 3px 0;}

    I changed the background to rgba(0,0,0,.7) which sets the red, green, and blue values to 0 which is black and then sets the alpha (opacity) to .7 (70%).


    I added display inline-block to make the background expand around the text's box model instead of just highlighting the text.


    Lastly I added some padding to give a little breathing room on top and bottom of the text and to take up the rest of the height not already being used by the thumbnail div.

    • Like 1
  • Create New...