Auto change text in Carousel

I want to create a 3d carousel. However, the challenge I'm facing is that I want it to change text each time it rotates. This text is gotten from a database. Every time it shows some text, the next time it reaches the same point, it will show some other text until it goes through the entire database, at which point it starts over. How can I do this exactly? I don't want to put a million div's either. I only want one div from which I can give it an id which gives it the text.

One thought I had was timing it. However there is a slight delay between the time the carousel starts and the time the page is loaded which will cause it to become out of sync. So, I'm looking for an alternative that doesn't require timing.

Material AngularJS ngShow and ngHide

I have created tabs in angularjs with material. I am hiding its tabs content from beginning. How can I show content on tab click with some animation. Some of my codes

<div flex="100" class="bookingBox" layout-align="center center" layout="row">
    <md-content flex="35">
      <md-tabs md-dynamic-height md-border-bottom md-center-tabs>
        <md-tab label="Item 1" ng-click="bookFlight()">
          <md-content class="md-padding ng-hide">
            Item 1
          </md-content>
        </md-tab>
        <md-tab label="Item 2" ng-click="myb()">
          <md-content class="md-padding ng-hide">
            Item 2
          </md-content>
        </md-tab>
        <md-tab label="Item 3" ng-click="olci()">
          <md-content class="md-padding ng-hide">
            Item 3
          </md-content>
        </md-tab>
      </md-tabs>
    </md-content>

My code pen http://codepen.io/milindsaraswala/pen/NrRZYV

Image in html element overflow

Chrome and other browsers have overscroll (also called elastic scroll, or rubber band scroll) for the html element. (See here or here.)

I want an image in the html overscroll as an easter egg, a bit like the Slack for iOS easter egg. (See "You are up to date." in the screenshot.)

The CSS

html {
    background: green;
}

gives the overflow a color. An image does not work:

html {
    background: url(image.png);
}

How can I put an image in the html overflow?

html and cgi: response to one frame of a frameset

I want to build a model retrieval system like NTU 3D model retrieval system. In my index.html: <frameset cols="25%, 75%"> <frame name="query_frame" src="query.html"> <frame name="resutls.frame" src="introPage.html"> </frameset> query.html: <form enctype="multipart/form-data" action="cgi-bin/processQuery.cgi" method="post"> <input id="fileupload" name="myfile" type="file"> <input type="submit" value="Load this file"> </form> My page then looks like this: After loading the file, I want to achieve this goal: 1. Remain the frameset structure. 2. Left frame remains unchanged. 3. Right frame show the results. Just like this. I do not have much idea how to write my action part: processQuery.cgi. But a simple file: #!/usr/bin/python html=""" ... <p>hello</p> ... """ print html makes the response page looks like this:

Popup window with three buttons

I need to popup a window with three buttons when the user clicks on a text.

What I have in my java class:

myHtml.append("<a href="" + myUrl+ "" onclick="javascript: return confirm('" + myMessage + "')">" + myLink + "</a>");

What I need is to not use "confirm". I need to use a popup similar to confirm() but with 3 different actions.

How can I replace confirm() to have 3 different actions instead of "ok" and "cancel" only?

EDIT

I have another idea, I can call prompt from the java class but my problem is how to get the prompt result inside my java class??

myHtml.append("<a href="" + myUrl + "" onclick="javascript: return prompt('" + myMessage + "')">" + myLink + "</a>");

scrollbar keeps on scrolling down in jstree

I have a set of data being displayed as a tree by the help of jstree plugin and jquery.

The data shows up perfectly in the tree structure. On expanding the last node in the tree the scrollbar appears on the right side of the div block.

Problem: However if I navigate within the tree with the mouse over the scrollbar, the scrollbar keeps on scrolling down and does not go up.

I am at wits end what could the reason be. I am using a Mozilla Firefox browser.

Please help.

Sample Code below:

css:

.myScrollableBlock {
display:block;
height:170px;
overflow:auto;
}

.jsp:

<div id="myTreeDiv" class="myScrollableBlock">
</div>

.js:

$('div#myTreeDiv').jstree({
// jsTree plugins
    ...
    ...
    ...
});

Symfony 3 - {{asset('assets/css/main.css')}} not working

binding a CSS-File should be simple in symfony 3 according to every tutorial and the documentation. But in my case, it just doesn't work.

In my base.html.twig i have

<link rel="stylesheet" href="{{asset('assets/css/main.css')}}" />

while in the folder web/assets/css/ there is a main.css file. But it just doesn't take effect.

Did I do something wrong?

EDIT:

maybe one more info.. when i look at the sourcecode there is a <link rel="stylesheet" href="/assets/css/main.css" /> in the head of the document, but when I click on the link it outputs a No route found for "GET /assets/css/main.css" (from "http://localhost/application/3")