-1

I'm a Dutch boy with my own website and i'm kind of new to all the programming. I know the little basic HTML, but my knowledge stops there. Now I wanted to create something on my page where I offer some services for the computer and more.

So on the left I want to have all my services listed and on the right the info for that service. I don't want all info just on the right, I want it to appear and disappear when you click a service on the same page. When no service is clicked, I want to have a text with some explanation about the services and more. I want the possibility to change the info and add images and some HTML plugins. I think this is possible with HTML5 (or Javascript, maybe jQuery) only I don't know how.

This is where I want to test it: http://webguideict.com/test/
My website is running on Wordpress and might be slow because of the hoster I have (BlueHost), I'm doing it on my own and they were very cheap, now I know why.

Are there programmers that can and want to help me with my problem? Preferably with some pre-written code or just very simple explained, I love to learn!

Thanks in advance!
Thomas

4

2 回答 2

1

您的具体问题听起来主要是 jQuery/javascript。

See this jsFiddle example

HTML：

<h2>Services:</h2>
<ul>
    <li id="con">
        Consulting
    </li>
    <li id="pro">
        Programming
    </li>
    <li id="brd">
        Longboarding
    </li>
</ul>
<div id="msg"></div>

jQuery：

$('li').click(function(){
    var svc = $(this).attr('id');
    //alert(svc);

    if (svc=="con"){
        $('#msg').html('<h2>Professional Services</h2>I can help with computer consulting.');
    }else if(svc=="pro"){
        $('#msg').html('<h2>Beanie Work</h2>If you can conceive it, I can code it.');
    }else if(svc=="brd"){
        $('#msg').html('<h2>Sidewalk Surfing</h2>Grocery deliveries with style...');
    }
});

托马斯，有很多很棒的网站提供免费教程，可以做你想做的所有事情。

我建议至少完成其中一些（免费）10 分钟教程，如果你真的想学习，甚至可能全部完成。它们是一个很好的起点：

phpAcademy.org
thenewboston.com
200 个十分钟的 jQuery tuts
注册和登录教程

这是咨询/记忆 jquery 选择器/方法的宝贵资源：

jQuery 选择器
jQuery 事件
只要继续点击Next Chapter，它将带您再浏览六页...打印并存储在大厅下方的小阅览室中...

于 2013-09-24T18:50:22.677 回答
0

我开始的方式是使用网站http://www.codecademy.com/，然后在我启动并运行后参与该网站。祝你好运！

于 2013-09-24T18:49:29.330 回答