jQuery Forum

First of all its  very hard to predict what markup your serverside code generates.

You didn't post what jQuery code you written.

Share an url or set up a jsfiddle page from where we can visualize it.

Check your console and see is there any errors.

Include either  vertical.news.slider.js or vertical.news.slider.min.js, both are same, 2nd one is minified only.

Hello and thanks for replying.

Hello.

I set up a fiddle. Just hard coded the data that was being fetched from db by server side code.

http://jsfiddle.net/yz3gdgac/4/

some css elements still missing. I'm trying to put it in the css section. But as you can see, the basic functionality doesn't work at all. 

Look forward to all the assistance from forum members.

Your fiddle isn't working

Add all required js files there

http://jsfiddle.net/yz3gdgac/9/

Added the jQ framework I am using in my project, 1.9.1 and some other updates as well.

It still doesn't loop over as it is supposed to. What could be the reason behind it not working still ..

I updated your fiddle and its working here http://jsfiddle.net/yz3gdgac/11/

I made changes in html, to see the html just compare what html you had against mine.
Your one is http://jsfiddle.net/yz3gdgac/9/
Mine one is http://jsfiddle.net/yz3gdgac/11/

I changed jQuery version, that jQuery plugins only works with jQuery 1.8.3 version not with higher.

I removed js code and added plgins js under External Resources , also added css required for this plugin in same External Resources  area, this plugin dependent on its own css and will not work without that.

http://www.impressivewebs.com/demo-files/vertical-news-slider/css/vertical.news.slider.css
 

Hello.

I had simply downloaded those two files, the js and the css previously and added them to my project under bundles of BundleConfig of App_Start, as is the norm in .NET mvc applications. And as expected, the files loaded too when the pages were rendered. The JQ fmwk version was wrong for me. I'll revert to 1.8.3. I hope that will do the job. 

html is the same for both the fiddles. Some of the unwanted css [mostly for bootstrap responsive] you have also removed. Difference is:: you added the external references in the fiddle, the css and js file.

Let me check it myself. I'll get back with the developments.

Oh yes, correct. I just went back and checked it. Correct you are.

Hello.

I'm facing some issues. 

See this fiddle:    http://jsfiddle.net/yz3gdgac/11/  working absolutely ok.

Now see this:      http://jsfiddle.net/yz3gdgac/15/  works ok as well. difference between the two is, I added the extra files css and js for bootstrap. Like they are in my main project too.

But what I get in my main project is that:  ::  that thin grey coloured strip *nh-anim* connecting the names list to the detailed data on the right and ticking/rolling periodically, doesn't work in my main project at all. It is not present in the first place, so rest aside the ticking effect.

Why could this be so? where is the conflict? where could the problem lie? I'm finding it hard to identify it. Cuz, I check console, but it doesn't show any error/exception relating to this plugin and the css js files.


Please help me.
Thanks in advance.

I saw your 2nd slide is working perfect.

If you can created fiddle with your problem then i can look into that can fix.

Hi.

Actually I'm really confused now as to how exactly I am supposed to create the fiddle to specifically target the particular problem. This fiddle goes closest   http://jsfiddle.net/yz3gdgac/15/  to simulating my actual project scenario without having to share my project itself. 

Just one thing:::: should it be <li class='nh-anim'> and then subsequently <li class='nh-anim selected'> as the ticker moves? Remember, we did <li class='selected'> earlier.

No, add nh-anim to all li and nh-anim and selected to first li only like

<li class="nh-anim selected">
        <strong>A</strong>
</li>
<li class="nh-anim">
        <strong>B</strong>
</li>
<li class="nh-anim">
        <strong>C</strong>
</li>
<li class="nh-anim">
        <strong>D</strong>
</li>

ok.
let me do it accordingly. 

I'll report the latest developments.
Stay tuned.