Hi! I’m Starx

Question 1

Question by gidzior

hi i need to write if statement which checking if span has class “nie” and if so it should changed background file but my statement setting every where first bg file “bg-nie.png”, what is wrong ?

jQuery code

if ($(".rzuty span.mieszkanie").hasClass("nie")) {
        $(".rzuty span.mieszkanie").css("background", "url(img/rzuty/mieszkania/bg-nie.png) repeat");
    } else {
        $(".rzuty span.mieszkanie").css("background", "url(img/rzuty/mieszkania/bg-tak.png) repeat");
    }

HTML

<div id="rzuty07p" class="rzuty">
    <span id="c_07_226" class="mieszkanie" title=""></span>
    <span id="c_07_228" class="mieszkanie" title=""></span>
    <span id="c_07_227a" class="mieszkanie" title=""></span>
    <span id="c_07_227b" class="mieszkanie" title=""></span>
    <span id="c_07_229" class="mieszkanie nie" title=""></span>
    <span id="c_07_005" class="mieszkanie" title=""></span>
    <span id="c_07_006" class="mieszkanie" title=""></span>
    <span id="c_07_008" class="mieszkanie" title=""></span>
    <span id="c_07_007a" class="mieszkanie nie" title=""></span>
    <span id="c_07_007b" class="mieszkanie nie" title=""></span>
</div>

Answer

Answer by Curt

Curt

This can be simplified to not require an if statement. Just filter your selection further:

var $rzutyspan = $(".rzuty span.mieszkanie");
$rzutyspan.filter(".nie").css("background", "url(img/rzuty/mieszkania/bg-nie.png) repeat");
$rzutyspan.not(".nie").css("background", "url(img/rzuty/mieszkania/bg-tak.png) repeat");

See Demo: http://jsfiddle.net/4A4W7/

Alternatively, this can be achieved with plain CSS:

.rzuty span.mieszkanie
{
   background: url(img/rzuty/mieszkania/bg-tak.png) repeat;
}
.rzuty span.mieszkanie.nie
{
   background: url(img/rzuty/mieszkania/bg-nie.png) repeat;
}

Answer

Answer by Starx

Starx

Well, you are using a common class .mieszkanie to check and manipulate all the set that matches. Check and manipulate separately:

$(".rzuty span.mieszkanie").each(function(k,v) {
    if ($(this).hasClass("nie")) {
        $(this).css("background", "url(img/rzuty/mieszkania/bg-nie.png) repeat");
    } else {
        $(this).css("background", "url(img/rzuty/mieszkania/bg-tak.png) repeat");
    }
});

Question 2

Question by Ketan

Ketan

Can any one explain me difference between   and   ?

I have html data stored in database in binary form and space in that can be either of   or   or sometimes  .

Also issue is when I convert this HTML to plain text using JSoup lib it is converting it properly but if I use String.contains(my string) method of java. It looks like the HTML data which is having   is different from which is having  . String is not found in either vice versa.

Example:

HTML1 : This is my test string

HTML2 : This is my test string

If I convert it to plain text using JSoup. It returns

HTML 1 : This is my test string

HTML 2 : This is my test string

But still both string are not same. Why is it so?

Answer

Answer by strnk

strnk

  is the classic space, the one you get when you hit your spacebar, represented by his HTML entity equivalent.

  and   represents the non-breaking space, often used to prevent collapse of multiple spaces togethers by the browser :

"    " => ” ” (collapsed into only one space)

"    " => ” ” (not collapsed)

If you are parsing a string containing both classic and non-breaking spaces, you can safely replace one by the other.

Answer

Answer by Starx

Starx

 , is just a space character nothing more. Regular occurrence of this character will collapse to one space character at the end.

Where as &#160 and   both represent non-breaking space character and if they occur continuously one after another, they will be collapse or break to one space character.

Only, difference between them is that &#160 is the HTML number and   is a HTML name.

Basically all of these are HTML entities. You can learn and know about them, seeing the following links.

Question 3

Question by Mihad Aiko

Mihad Aiko

I was wondering if anyone knows if there was a javascript or something that scrolls a site left right up and down on a click.

For example I want to create a site with multiple divs. Look at photo below.

enter image description here

I want each div to fit to screen and div 1 being the main div, the starting point. Say that I had a link in the menu for biography and the content for biography was in div 4 and someone click biography, I want the site to move down to div 3 and then right to div 4 and the same thing goes for div 4 and all the divs. When someone clicks a link in the divs I want the site to scroll in a direction I specify, is this possible.

Left Right Up Down

Answer

Answer by Starx

Starx

Yes, they are:

Question 4

Question by user1599841

user1599841

I need a website that has log ins, individual account feature can run custom jquery, php code page and display table from database with great flexibility, (If not this is where the jQuery and custom PHP comes in) easy customizable theming and layouts and about 5 – 7 php pages.

Would i be better off writing my own CMS or use which are already available on the Internet?

Which CMS would you recommend? I’ve browsed Drupal and Joomla videos and i can’t find any in depth detail to how flexible these are. They seems to be tailored to blogs and non programming managements.

Or, maybe i should be looking at a framework instead? I don’t want to pick wrong CMS. Please suggest me to make the right choice.

Answer

Answer by Starx

Starx

If you are not a programmer yourself, then there is no other options but to choose those which are already available.

Since scalability is the big question here, if you are a programmer/developer then adding and modifying features to an pre existing system is not so a big problem. Some of the reasons to consider open source softwares:

They have near zero amateur mistakes, on coding standards.
Codes are thoroughly check again and again by developers and other interested contributors over and over again.
Support can be found very easily.
Issues are regularly fixed and upgraded version are available.
System are tested to provide maximum performance.

Which CMS would you recommend?

This is a question only you can answer. Read about the CMS itself. Learn about the features that it provides. If they are enough for what you are trying to build, then pick that one, or else see another CMS.

I can’t find any in depth detail to How flexible these are?

This is a mis-understading. CMSs like Joomla, Drupal they have been around for a very long time. They are continuously improved and debugged. Support for them are globally available through sites like Stackoverflow itself. The massive global community only expands these systems.

Many developers or agencies build plugins, extensions for these CMS system. How are they doing that? Every system can be scaled and is flexible. It depends on you, how much you can work with it.

Where as,

You are a very enthusiastic programmer, and just like to build application your way just to enjoy the thrill of bugs and enjoy banging your head most of time 😉 and learn a lot at the same time then why not? build your own system.

Question 5

Question by Andrey Lima Ramos

Andrey Lima Ramos

I am using MVC3.
I have a table and an Html.ActionLink inside of it.
I have already set the text decoration for none, but the link is still blue. I change the table:hover background-color and the color(of the text), and when I put the mouse over the row, the text that are not a link gets white, but the link still blue. If I change the a:hover, the link gets white just when I put the mouse over it, and not just over the row.

Is there a way to do that with css?

Answer

Answer by Starx

Starx

Typically, to cover all the anchors when you are hovering over the row.

#tableid tr:hover a {
    /* Your Styles */
}

But this does not work on all IE browser so, use JS to catch the event and apply styles to anchors in it.

Question 6

Question by user1566921

user1566921

Here is the class I am unit testing. Currently I am testing the doSomething function:

class FooClass {
  public function doSomething( $user ) {
    $conn = $this->getUniqueConnection( $user->id );
    $conn->doSomethingDestructive();
  }

  private function getUniqueConnection( $id ) {
    return new UniqueConnection( $id );
  }
}

As you can see, the doSomething function gets a new instance of UniqueConnection (a class I am not testing here) based on a property of the argument it receives. The problem is that UniqueConnection:: doSomethingDestructive method is something I cannot call during tests due to its… destructiveness. So I would like to stub/mock the UniqueConnection rather than use a real one.

I don’t see any way to inject my mocked UniqueConnection. I would make the UniqueConnection a constructor argument for FooClass but, as you can see, a new one gets created based on the parameter to the doSomething function and all the unique ids it may be called with are not known ahead of time.

My only option that I can see is to test a mock of FooClass instead of FooClass itself. Then I would replace the getUniqueConnection function with one that returns a mock/stub. This seems bad to test an mock, but I don’t see any way to achieve what I am after otherwise. UniqueConnection is a third party vendor library and cannot be modified.

Answer

Answer by Starx

Starx

Creating classes in a way that it can support different modes of execution is very important in some cases. One of these cases is what you are asking for.

Create your classes to support various modes. For example

Class Connection {
    private $mode;

    public function setMode($mode) {
         $this -> $mode = $mode;
    }
}

Now, your doSomethingDestructive can act as per the execution mode.

public function doSomethingDestructive() {
    if($this -> mode === "test") { //if we are in a test mode scenario
        //Log something
        // Or just do some logging and give a message
    } else {
        // do what it was suppose to do
    }
}

Next time, when you are testing the class, you dont have to worry about that destructive function doing something destruction accidentally.

  public function doSomething( $user ) {
    $conn = $this->getUniqueConnection( $user->id );
    $conn -> setMode("test"); //Now we are safe
    $conn->doSomethingDestructive(); //But the Testing is still being Ran
  }

Question 7

Question by CappY

CappY

Can you please help me with reg ex. I cant make it 🙁 I hate regex.
I need to match this string ${ANY_TEXT} .Exactly one “${” and exactly one closing tag “}”.

Thanks a lot. 🙂

Answer

Answer by Shi

Shi

${[^}]+} will match it. It will match ${ABC} from ${ABC}}} as well. If you want to match complete lines, simply anchor the regular expression using ^${[^}]+}$.

A good site to learn regular expressions is http://www.regular-expressions.info/.

Answer

Answer by Starx

Starx

I suppose this covers all the texts.

/^${[a-zA-Z]}$/

Question 8

Question by Gilles jr Bisson

Gilles jr Bisson

I have the following html and css code :

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
body
{
  background-color:#d0e4fe;
}

div.container
{
  width: 600px;
  border: solid 1px black;
}

div.divLeft
{
  display:inline-block;
  border: solid 1px red;
  color: red;
}

div.divRight
{
  display:inline-block;
  border: solid 1px blue;
  color: blue;
}

</style>
</head>

<body>
  <div class="container">
    <div class="divLeft">
      <p>1 - Some short text</p>
    </div>
    <div class="divRight">
      <p>Some not too long text with the div besides the first one.</p>
    </div>
  </div>
  <div class="container">
    <div class="divLeft">
      <p>2 - Some short text</p>
    </div>
    <div class="divRight">
      <p>Some very long text that will eventually wrap because it is so long and when it wraps is when the trouble starts because the div moves down instead of staying besides the first one.</p>
    </div>
  </div>
</body>
</html>

In the second case, is there a way to keep the div besides the first one instead of it moving below the first one. Note that I can not use fixed width for my divs as the length of the text that will appear in them in unknown. Then only thing I know is the text in the first div will always be short and the text in the second one may be long.

Here is a basic diagram of what I would want :

First div text  Second div text stays beside the first one
                and wraps around still being aligned like this

Thanks all !

Answer

Answer by Gilles jr Bisson

Gilles jr Bisson

Ok. I finally manage to do exactly what I needed with the use of a table with only one row and two cells. The table takes the whole width. The text of the first cell is nowrap so it takes up all the space it needs. The text on the second cell takes up the remainder of the space and wraps as it needs and stays nicely aligned.

Answer

Answer by Starx

Starx

Elements displayed as inline-block wraps according to its contents and tries to remain inline. The code you are using does exactly this. When the second div’s content is overflowing it increases the size to accommodate.

The proper solution to this, is to add width to the element.

.divLeft { width: 150px; vertical-align: top; }
.divRight { width: 400px; vertical-align: top; }

Demo

Question 9

Question by Kevin L.

Kevin L.

Is there a CSS selector for the first element of every visual row of block items?
That is, imagine having 20 block elements such that they flow across multiple lines to fit in their parent container; can I select the leftmost item of each row?

It’s doable in JavaScript by looking at the top position of all of the elements, but is it possible in plain CSS?

Answer

Answer by Starx

Starx

Yes, Its possible through CSS but only if you can fix the elements in every row.

Since you haven’t provided your case, here is an example.

Suppose, your elements are stacked up in a ul and li pattern and are three lists in a row, then you can use the following css snippet.

li:first-child, li:nth-child(3n+1) {
    background: red;
}

Demo

Question 10

Question by 3gwebtrain

3gwebtrain

I am simply trying to make a selector component with some of the options, i am not get any result it this. really some thing wrong the way what i do.

any one can help me in this?

var object = {
               "id":"countries",
               "label":"Country",
               "name":"countries",
               "type":"select",
               "options":[
                  {
                     "value":"",
                     "text":"Select Country"
                  },
                  {
                     "value":"in",
                     "text":"India",
                      "selected":"true"
                  },
                  {
                     "value":"us",
                     "text":"United Stated"

                  },
                  {
                     "value":"uk",
                     "text":"United Kingdom"
                  },
                  {
                     "value":"cn",
                     "text":"Canada"
                  }
               ]
};
var select = "";

var mapInfo = function (element,info) {
    $.map(info, function(val,num){
console.log(val);        
    })
}

var generateSelector = function (info){

    select +='<select'+info.id+'></select>'
    select +=mapInfo(select,info.options)

   $('body').append(select);

}(object);

jsfiddle here

Answer

Answer by undefined

undefined

Try this:

var $select = $("<select id='"+obj.id+"' name='"+obj.name+"'/>");
var selected = '';
var generateSelector = function (info){
    $.each(obj.options, function(i, ob){
        if (ob.hasOwnProperty('selected')) {
             selected = ob.value;
        }
        $select.append('<option value='+ob.value+'>'+ ob.text+'</option>')
    })

   $('body').append($select);
   $('select').val(selected)
}

Demo

Answer

Answer by Starx

Starx

Here is my version of the generator. 🙂

$(object).each(function(i,v) {
    var label = $("<label />", { html: v.label, 'for': v.name });
    var element;
    switch(v.type) {
        case "select":
            element = $("<select />", { id: v.id, name: v.name  });
            $(v.options).each(function(x,y) {
                var option = $("<option />", { value : y.value, html : y.text });
                element.append(option)
            });
        break;
    }
    $("body").append(label, element);        
});

[See it in action]

This can handle multiple sets of data
As scalability, it can be extended to cover more than just select types.

Hi! I’m Starx

experienced Software Developer. And this is my blog

Blog Page

if element hasClass then change background file

Question by gidzior

Answer by Curt

Answer by Starx

Difference between   and

Question by Ketan

Answer by strnk

Answer by Starx

Is there a js function that scrolls a site left right up and down?

Question by Mihad Aiko

Answer by Starx

Would it be better to build a CMS from scratch?

Question by user1599841

Answer by Starx

How can I chage the color of the link in Html.Action link, when the mouse is over the div?

Question by Andrey Lima Ramos

Answer by Starx

Is it bad to mock the object being tested in a unit test?

Question by user1566921

Answer by Starx

Regular Expression, match ${ANY_TEXT}

Question by CappY

Answer by Shi

Answer by Starx

How to keep two inline-block divs side by side even if second div overflows

Question by Gilles jr Bisson

Answer by Gilles jr Bisson

Answer by Starx

CSS selector for first element of visual (block reflow) row

Question by Kevin L.

Answer by Starx

Demo

how can make the slect element and append options?

Question by 3gwebtrain

Answer by undefined

Answer by Starx

Please fill the form - I will response as fast as I can!