Month: February 2011
Nabin Nepal (Starx) jquery jquery-animate
February 22, 2011

jquery.animate background-position doesn't work

Question by ran levi

ran leviran levi

I’m trying to create a background position change with animation.
but for some reason it’s not working.

<script language="javascript" src="http://code.jquery.com/jquery-1.5.min.js"></script>
<div class="moveme" style="height:80px;width:240px;background-image:url('http://www.google.de/intl/en_com/images/srpr/logo1w.png');background-repeat:no-repeat"></div>

<script language="javascript">
    $('.moveme').css("background-position","0px 0px").animate({backgroundPosition:"-100px 10px"});
</script>

ideas?

Answer by Cristy

CristyCristy

jQuery doesn’t support this on default.

You can use a plug-in like : http://plugins.jquery.com/project/backgroundPosition-Effect

EDIT:

I was wrong, it works:

$(function() {
  $('.moveme').css("backgroundPosition","0px 0px").animate({"backgroundPosition":"-100px 10px"});
});

It works if you type in the address bar, but it seems I can’t make this work on jsfiddle, strange… xD

Answer by Starx

StarxStarx

Wrap it inside a 

$(document).ready(function() {
     $('.moveme').css("backgroundPosition","0px 0px").animate({backgroundPosition:"-100px 10px"});
});
Nabin Nepal (Starx) css html javascript
February 11, 2011

Fullscreen vlc with controls at the bottom

Question by c2h2

c2h2c2h2

I’m new to css and going to make a VLC embed into a fullscreen webpage (a kiosk app) with some controls at bottom of the screen.

can you tell me how css should be written?

---------------------------------------------------------
|div-doc                                                |           
|+-----------------------------------------------------+|
|| div-vlc                                             ||
||                                                     ||
||                                                     ||
||                                                     ||
||                  MOIVE HERE                         ||
||                                                     || no y-scroll
||                                                     ||
||                                                     ||
||                                                     ||
||                                                     ||
|+-----------------------------------------------------+|
|+-----------------------------------------------------+|
||div-control                                          ||
|+-----------------------------------------------------+|
---------------------------------------------------------
                    no x-scroll
note: 1. div-doc has 2 sub-divs (div-vlc and div-control)
      2. div-control always at bottom
      3. background of everything should be black

Thanks Guys

–EDIT 1– 

body{background:black}
#div-doc { width: 100%; height: 100% }
#div-vlc { height: 95%}
#div-control {height: 5%}

But why i’m still getting y-scroll when div-doc specifies 100%?

Answer by Starx

StarxStarx

A simple CSS to show the layout over the full page with out the scroll bar would be something like this

body { margin:0; padding:0; overflow: hidden; }
#div-doc { width: 100%; height: 100%; }
Nabin Nepal (Starx) mysql

how to select random unique records on each execution of the SQL Query

Question by Ashish

AshishAshish

I have a table “masterurls” it has morethan 1 million records. I want to fetch random records each time the query executed. It should not have any of the records that were fetched in previous executions. I’m already have this query:

SELECT m.url FROM masterurls ORDER BY RAND() LIMIT 200

The problem is the above query returns only first 200 hundred records and randomizes it each time.

Answer by The Scrum Meister

The Scrum MeisterThe Scrum Meister

Since you can pass a seed parameter to the RAND() function, you can “paginate” the random results by generating a seed before the first page.

Sample code:
For the first page (varies by language):

int seed = Math.abs(new Random().nextInt());

SQL query:

SELECT url FROM masterurls ORDER BY RAND({seed}) LIMIT 200;

Store the seed somewhere (for web-based applications you can use a url parameter or session).
For the next pages:

SELECT url FROM masterurls ORDER BY RAND({seed}) LIMIT 200 * {pageNumber}, 200;

Note: Sorting by RAND() is a heavy operation, you might be better off storing a indexed column with the Hash Code of the url, then using a module-based or other random functions.

Answer by Starx

StarxStarx

How are you going to know if the url is already accessed before. My best suggestion would be setting a flag to know this in the table. Add a field like view in the table which will accept two values 1 or 0, 1 for already accessed and 0 for not accessed. Then you could use

SELECT m.url FROM masterurls m WHERE view='1' ORDER BY RAND() LIMIT 200;
...

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